Vern Blog
0%

30行代码构建HTTP服务器

Posted on Edited on In

image

前两天调代码，想查看测试覆盖率生成的网页报告文件，没有安装 HTTP 服务器客户端。就在 VS Code 中下载一个叫Live Server的插件，用来启动 HTTP 服务。感觉效果还不错，然后今天和大家用 Node 来实现一个。

开始

构建 HTTP 服务，需要先了解一下 HTTP 协议的基础知识

HTTP 工作原理

HTTP 协议定义 Web 客户端如何从 Web 服务器请求 Web 页面，以及服务器如何把 Web 页面传送给客户端。HTTP 协议采用了请求/响应模型。客户端向服务器发送一个请求报文，请求报文包含请求的方法、URL、协议版本、请求头部和请求数据。服务器以一个状态行作为响应，响应的内容包括协议的版本、成功或者错误代码、服务器信息、响应头部和响应数据。

HTTP 请求格式

request

HTTP 响应格式

response

编码

这里的需求比较简单，只要能 GET 即可，不需要 POST

这里会用到 Node 的http和fs模块

导入模块

1
2
const http = require("http");
const fs = require("fs");

创建服务

1
2
const server = http.createServer(); // 创建服务
server.listen(8888); // 监听端口

Content-Type 的 HashMap

这里定义了我们网页中，常用的一些文件类型

1
2
3
4
5
6
7
8
9
const CONTENT_TYPE_MAP = {
  // 定义 Content-Type 的 HashMap
  html: "text/html; charset=UTF-8",
  htm: "text/html; charset=UTF-8",
  js: "application/javascript; charset=UTF-8",
  css: "text/css; charset=UTF-8",
  txt: "text/plain; charset=UTF-8",
  mainfest: "text/plain; charset=UTF-8",
};

处理 Request

在返回 response 的时候，如果文件类型在CONTENT_TYPE_MAP中没有，我们则以application/octet-stream类型返回，浏览器端会直接将文件下载到本地。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
server.on("request", function (request, response) {
  const url = require("url").parse(request.url);
  const filename = url.pathname.substring(1);
  const suffix = filename.substring(filename.lastIndexOf(".") + 1); // 获取文件后缀
  fs.readFile(filename, function (err, content) {
    if (err) {
      response.writeHead(404, {
        "Content-Type": "text/plain; charset=UTF-8",
      });
      response.write(err.message);
    } else {
      response.writeHead(200, {
        "Content-Type": CONTENT_TYPE_MAP[suffix] || "application/octet-stream",
      });
      response.write(content);
    }
    response.end();
  });
});

到这里，借助 Node V8 引擎，一个极为轻量化、性能优异的基础 HTTP 服务器就开发完成了。需要本地启动 HTTP 服务器的时候，再也不用到网上下载啥客户端了，30 行代码就搞定。需要的时候，直接命令行启动即可。

项目源码请访问: https://github.com/tkvern/node-http-server

Welcome to my other publishing channels