nodejs02

最新推荐文章于 2025-09-10 19:44:49 发布

转载最新推荐文章于 2025-09-10 19:44:49 发布 · 62 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://yq.aliyun.com/articles/383450

文章标签：

#javascript #ViewUI

Node.js没有根目录的概念，因为它根本没有任何的web容器！
让node.js提供一个静态服务，都非常难！
也就是说，node.js中，如果看见一个网址是
1127.0.0.1:3000/fang
别再去想，一定有一个文件夹，叫做fang了。可能/fang的物理文件，是同目录的test.html
URL和真实物理文件，是没有关系的。URL是通过了Node的顶层路由设计，呈递某一个静态文件的。

02.js

//require表示引包，引包就是引用自己的一个特殊功能
var http = require("http");
var fs = require("fs");

//创建服务器，参数是一个回调函数，表示如果有请求进来，要做什么
var server = http.createServer(function(req,res){
    if(req.url == "/fang"){
        fs.readFile("./test/xixi.html",function(err,data){
            //req表示请求，request;  res表示响应，response
            //设置HTTP头部，状态码是200，文件类型是html，字符集是utf8
            res.writeHead(200,{"Content-type":"text/html;charset=UTF-8"});
            res.end(data);
        });
    }else if(req.url == "/yuan"){
        fs.readFile("./test/haha.html",function(err,data){
            //req表示请求，request;  res表示响应，response
            //设置HTTP头部，状态码是200，文件类型是html，字符集是utf8
            res.writeHead(200,{"Content-type":"text/html;charset=UTF-8"});
            res.end(data);
        });
    }else if(req.url == "/0.jpg"){//请求html页面里面的内容也要自己写路由路径
        fs.readFile("./test/0.jpg",function(err,data){
            //req表示请求，request;  res表示响应，response
            //设置HTTP头部，状态码是200，文件类型是html，字符集是utf8
            res.writeHead(200,{"Content-type":"image/jpg"});
            res.end(data);
        });
    }else if(req.url == "/bbbbbb.css"){//请求html页面里面的内容也要自己写路由路径
        fs.readFile("./test/aaaaaa.css",function(err,data){
            //req表示请求，request;  res表示响应，response
            //设置HTTP头部，状态码是200，文件类型是html，字符集是utf8
            res.writeHead(200,{"Content-type":"text/css"});
            res.end(data);
        });
    }else{
        res.writeHead(404,{"Content-type":"text/html;charset=UTF-8"});
        res.end("嘻嘻，没有这个页面呦");
    }
});

//运行服务器，监听3000端口（端口号可以任改）
server.listen(3000,"127.0.0.1");

xixi.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        div{
            width: 200px;
            height: 200px;
            background: red;
        }
    </style>
</head>
<body>
    <div></div>
</body>
</html>

haha.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        div{
            width: 200px;
            height: 200px;
            background: green;
            border-radius: 50%;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="bbbbbb.css" />
</head>
<body>
    <img src="0.jpg" alt="">
    <div></div>
</body>
</html>