Node.js学习(三)---入门级 教程实例 顶层路由设计

此文章的目的是理解nodejs的路由,

首先项目的目录

c.css

body{
    background-color: green;
}

b.js

document.write("bnode.js ");

e.js

document.write("enode.js ");

index.html

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/anode.css" />
    <style type="text/css">
        div{
            width: 100px;
            height:100px;
            background: red;
            border-radius: 50%;
        }
    </style>
</head>
<body>
<!--文件名和路径不同确定可以请求到吗???-->
<img src="/a/b/c/images/cnode.png" alt="">
<img src="dnode.png" alt="">
<div></div>
<!--为何同一个文件路径可以随意写?-->
<script type="text/javascript" src="js/bnode.js"></script>
<script type="text/javascript" src="enode.js"></script>
</body>
</html>

demo01.js

/**
 * Created by Administrator on 2018/10/8.
 */

//require表示引包,引包就是引用一个功能.只有引了包功能才能用
var http = require("http");
var fs = require("fs");
//创建服务器,参数是一个回调函数,回调函数作用当请求进来,要做的事情
var server = http.createServer(function(req,res){
    //console.log(req.url);
    if(req.url == "/"){
        fs.readFile("./index.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 == "/a/b/c/images/cnode.png"){
        fs.readFile("./images/c.png",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 == "/dnode.png"){
        fs.readFile("./images/d.png",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 == "/css/anode.css"){
        fs.readFile("./css/a.css",function(err,data){
            //req表示请求,request;  res表示响应,response
            //设置HTTP头部,状态码是200,文件类型是html,字符集是utf8
            res.writeHead(200,{"Content-type":"text/css"});
            res.end(data);
        });
    }else if(req.url == "/js/bnode.js"){
        fs.readFile("./js/b.js",function(err,data){
            //req表示请求,request;  res表示响应,response
            //设置HTTP头部,状态码是200,文件类型是html,字符集是utf8
            res.writeHead(200,{"Content-type":"text/css"});
            res.end(data);
        });
    }else if(req.url == "/enode.js"){
        fs.readFile("./js/e.js",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");




我们启动服务

看到页面如下

看下资源路径

 

URL和真实物理文件,是没有关系的。URL是通过了Node的顶层路由设计,呈递某一个静态文件的。

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值