Node.js 搭建 web 程序之路由配置

客官°小女子只卖身不卖艺 2023-07-13 08:08 12阅读 0赞

前一篇博客里我们说到了 `Node.js` 和 `fs` 模块的使用，主要是安装配置 `Node.js` 和 `HTTP` web模块，不了解的可以去看下我的前一篇博客 [Node.js 搭建 web 程序 之 使用基础][Node.js _ web _ _] ，本篇我们将`Node.js`和模块`模块`实现路由配置。

#### fs文件系统模块 ####

`fs`模块是 `Node.js` 主要用于读文件。

**引用模块**

var http = require('HTTP')

读取文件分为同步和异步读取。

**异步读文件**

fs.readFile('index.html', function(err, data) { 
        console.log(data)
    })

**同步读文件**

var data = fs.readFileSync("index.html","utf8");
    console.log(data);

当我读取创建的 `index.html` 文件，执行后来看一下，我们发现得到的是一串 `Buffer` 码。![在这里插入图片描述][20200311093221122.png_pic_center]  
将 Buffer 码处理一下。

fs.readFile('index.html', function(err, data) { 
        console.log(data.toString())
    })

此时输出的是 HTML 的文件内容。  
![在这里插入图片描述][20200311093656162.png_pic_center]  
在上篇博客中，我们简单的说到了 `HTTP` 模块搭建 `web` 服务，响应结束后返回的内容会在页面中显示，我们来简单的读取一个文件通过服务端访问。

// 引用HTTP模块
    var http = require("http");
    // 引用fs模块
    var fs = require('fs')
        // 创建服务
    var server = http.createServer();
    // 监听request事件
    server.on("request", function(req, res) { 
            // 异步读文件
            fs.readFile('index.html', function(err, data) { 
                // 响应结束
                res.end(data.toString())
            })
        })
    // 开启服务 端口号3000
    server.listen(3000)

![在这里插入图片描述][2020031109540897.png_pic_center]  
当我们通过 `localhost:3000` 访问就可以显示读取的文件内容了，但是我们如果访问其他页面的时候也是这个页面，可以一个服务器不可能就是一个页面，这就需要我们就需要 HTTP 模块的路由的配置了  
![在这里插入图片描述][20200311095635174.png_pic_center]

#### HTTP模块 ####

**路由的配置**

在我们监听 `request` 事件的时候得到两个参数，`request`请求 和 `response`响应。

server.on("request", function(request, response) { 
    	console.log(request)
    }

通过输出 `request` 请求，我们得到了一大堆参数，在这一大堆参数中，`url` 记录 `request` 请求的地址，`method` 记录 `request` 请求的类型，所有web文件的请求都是`GET`请求。

server.on("request", function(request, response) { 
    	console.log(request.url)
    }

![在这里插入图片描述][20200311101040152.png_pic_center]  
我们可以根据判断请求的地址，响应不同的文件。

// 引用HTTP模块
    var http = require("http");
    // 引用fs模块
    var fs = require('fs');
    // 创建服务
    var server = http.createServer();
    // 监听request事件
    server.on("request", function(request, response) { 
        if (request.url == '/index.html' && request.method == 'GET') { 
            fs.readFile('index.html', function(err, data) { 
                response.end(data.toString())
            })
        } else if (request.url == '/login.html' && request.method == 'GET') { 
            fs.readFile('login.html', function(err, data) { 
                response.end(data.toString())
            })
        }
    });
    // 开启服务 端口号3000
    server.listen(3000)

**响应头设置**

我们都知道，一个网页的资源是丰富多彩的，所以在请求的时候我们需要添加不同类型文件的响应头。

**文本的响应头**

response.writeHead(200,{ "content-type" : "text/html;charset=utf8"})
    response.writeHead(200,{ "content-type" : "text/javascript;charset=utf8"})

**图片的响应头**

response.writeHead(200,{ "content-type" : "image/jpeg"})
    response.writeHead(200,{ "content-type" : "image/png"})

简单的HTTP路由配置就在下方了，下篇博客我们将 `Node.js` 和 `MongoDB` 数据库一起使用

// 引用HTTP模块
    var http = require("http");
    // 引用fs模块
    var fs = require('fs');
    // 创建服务
    var server = http.createServer();
    // 监听request事件
    server.on("request", function(request, response) { 
        if (request.url == '/index.html' && request.method == 'GET') { 
            response.writeHead(200, {  "content-type": "text/html;charset=utf8" })
            fs.readFile('index.html', function(err, data) { 
                response.end(data.toString())
            })
        } else if (request.url == '/index.js' && request.method == 'GET') { 
            response.writeHead(200, {  "content-type": "text/javascript;charset=utf8" })
            fs.readFile('index.js', function(err, data) { 
                response.end(data.toString())
            })
        } else if (request.url == '/img.png' && request.method == 'GET') { 
            response.writeHead(200, {  "content-type": "image/png" })
            fs.readFile('img.png', function(err, data) { 
                response.end(data)
            })
        } else if (request.url == '/login.html' && request.method == 'GET') { 
            response.writeHead(200, {  "content-type": "text/html;charset=utf8" })
            fs.readFile('login.html', function(err, data) { 
                response.end(data.toString())
            })
        }
    });
    // 开启服务 端口号3000
    server.listen(3000)

[Node.js _ web _ _]: https://blog.csdn.net/qq_39157944/article/details/104711134
[20200311093221122.png_pic_center]: https://img-blog.csdnimg.cn/20200311093221122.png#pic_center
[20200311093656162.png_pic_center]: https://img-blog.csdnimg.cn/20200311093656162.png#pic_center
[2020031109540897.png_pic_center]: https://img-blog.csdnimg.cn/2020031109540897.png#pic_center
[20200311095635174.png_pic_center]: https://img-blog.csdnimg.cn/20200311095635174.png#pic_center
[20200311101040152.png_pic_center]: https://img-blog.csdnimg.cn/20200311101040152.png#pic_center