前言

上节课我们实操了node.js的模块化语法，结合相关知识制作了一个文章生成器。今天，让我们继续探索node.js的web构建功能。

http模块

在Node.js中，http模块是核心模块之一，它提供了一个用于创建HTTP服务器和客户端的API。这个模块非常基础且强大，允许你以编程方式处理HTTP请求和响应，从而构建Web服务器、Web服务或任何需要与HTTP协议交互的应用程序。

使用http模块，我们可以很容易地创建一个HTTP服务器，该服务器可以监听指定端口上的请求，并对这些请求做出响应。这是构建Web应用程序的基础，因为Web应用程序需要能够接受客户端（如浏览器）的请求，并返回相应的HTML、CSS、JavaScript文件或JSON数据等。

初始化

首先创建你的后端项目，在index.js文件中通过const 引入http模块。 http模块长啥样?我们打印看看

const http = require('http');

console.log(http);

在node.js中打印的http模块：

发送http请求

将项目运行在 http://localhost:3000/

访问方法

为什么我们在电脑浏览器上可以访问到我们向这个端口发送的东西？ 这是因为localhost 是一个主机名（hostname），它在网络配置中被特别指定为指向本地计算机。当访问 http://localhost:3000/ 时，浏览器会向本地计算机发送一个HTTP请求，请求3000端口。实际上我们的电脑就是一台服务器，localhost 代表我们电脑服务器的本地地址。请求 127.0.0.1：3000也能访问到页面。因为 127.0.0.1是一个特殊的IP地址，它和localhost一样始终指向当前计算机。

我们也可以通过自己的IPv4地址来访问这个端口，每个人的IPv4都不一样，我们可以打开终端，通过 输入指令 ipconfig 来查看IPv4地址在内的网络配置信息。 IPv4地址是当前分配给您的计算机的网络接口的地址。Ipv4也就是电脑的静态ip地址，我们可以通过访问他人的ipv4地址请求他的服务器地址

所以访问后端的方法有3种

判断路径

当我们访问不同的路径时需要返回不同的内容，这就需要判断url地址后根据url的不同返回对应的数据。如何实现一个简单的页面路径对应数据的判断？

1. 我们可以从node.js中引入url，之后利用url.parse()解析 URL 字符串。

2. req.url就是我们访问的后端地址

3. 可以通过 res.writeHead 发送一个响应头指明Content-Type帮助客户端正确解析和显示HTML内容。响应体的前后端内容类型需要保持一致。

4. 需要在Content-Type中指明阿斯克码，和数据格式。如 'application/json;charset=utf-8'

简单页面判断实现代码： 当访问路径下的user时返回对应数据，当访问正确端口之外的路径时返回null

const http = require('http');
const url = require('url');

const data = {
    name: '绵绵冰',
    age: 18
}

const server = http.createServer((req, res) => {
    const reqUrl = url.parse(req.url);
    if (reqUrl.pathname === '/') {
        res.writeHead(200, {
            'Content-Type': 'text/html;charset=utf-8'
        });
        res.end('<h2>欢迎启动web页面<h2>')
    } else if (reqUrl.pathname === '/user') {
        res.writeHead(200, {
            'Content-Type': 'application/json;charset=utf-8'
        });
        res.end(JSON.stringify(data))
    }

    else {
        res.end('null')
    }

});

server.listen(3000, () => {
    console.log('服务运行在3000端口');
});

实现效果：

请求测试工具

接口能否跑通十分重要，这意味着当你把项目完成后部署在服务器上之后，当其他用户通过url路径访问你的项目时能否成功访问。在这里介绍一个十分好用的测试工具，用于测试你的接口。

Apifox

点击如上页面网址或者使用postman都可以。

静态资源文件夹

当用户访问页面时我们不可能只给用户看光秃秃的对象，我们应当构建一些html结构。 举个例子，当用户访问错误的路径时，我们给他返回一个404界面。 在项目中新建一个assets文件夹用于装载静态文件，在其中新建文件404.html。如何在index.js中访问到这个页面？

需要让后端访问到前端的文件，在index.js中我们需要为后端传输该文件的绝对路径。引入fs和path模块,通过__dirname获取index.js所在文件夹通过resolve拼接后交给fs.readFileSync()��取，再通过 res.end()传向后端。

const http = require('http');
const url = require('url');
const fs = require('fs');
const path = require('path');

if(xxxx) { xxxx }
     else {
        // 拿到返回的页面路径
        const _url = path.resolve(__dirname, 'assets/404.html')
        const content = fs.readFileSync(_url, { encoding: 'utf8' })
        res.end(content)
        }

这样后端就能读取到对应的前端文件中的数据，将web页面展示给用户。

Koa

万一后端有一百个接口，难道就要考虑一百种情况，写一百个if(){}else{}吗？

不，这个时候需要我们使用koa来协助开发

在node.js中下载koa,下载koa-router。创造文件app.js文件和router文件夹，在router文件夹中新建user.js

    npm i koa
    npm i koa-router  

koa-router 为我们提供了一种登入不同路径显示不同页面的新写法。我们需要引入koa-router后立马调用，使用router.get设计页面信息。最后将router抛出。

在user.js中配置路由和页面数据：

const router = require('koa-router')();

router.get('/user', (ctx) => {
    ctx.body = {
        name: '绵绵冰',
        age: 18
    };
});

router.get('/user2', (ctx) => {
    ctx.body = {
        name: '绵绵冰2号',
        age: 20
    };
});

module.exports = router;

在app.js中引入Koa和你抛出的router。实例化Koa()，并在实例上使用use(router.routes()) 让路由生效：

const Koa = require('koa');
const app = new Koa()
const router = require('./router/uses.js')

app.use(router.routes())  // 让路由生效

app.listen(3001, () => {
    console.log('项目已经启动');
})

最终实现效果：