一、创建 web 服务器的基本步骤

1.1、导入http 模块

const http = require("http");

1.2、创建 web 服务器实例

const serve = http.createServer();

1.3、为服务器实例绑定 request 事件，监听客户端的请求

serve.on("request", (req, res) => {
  //只要有客户端来请求我们自己的服务器，就会触发 request 事件，从而调用这个事件处理函数
  console.log("Someone visit our web server");
});

1.4、启动服务器--调用 server.listen(端口号，cb回调) 方法，即可启动 web 服务器

serve.listen(80, () => {
  console.log("http server running at http://127.0.0.1");
});

1.5、完整代码

/* 导入http 模块 */
const http = require("http");
/* 创建 web 服务器实例 */
const serve = http.createServer();

/* 为服务器实例绑定 request 事件，监听客户端的请求 */
serve.on("request", (req, res) => {
  // 只要有人请求的了服务
  console.log("Someone visit our web server");
});
/* 调用 server.listen(端口号，cb回调) 方法，即可启动 web 服务器 */
serve.listen(80, () => {
  console.log("http server running at http://127.0.0.1");
});

1.6、node执行js文件

image.png

1.7、可以看到服务已经运行成功

image.png

1.8、浏览器访问127.0.0.1:80

image.png

1.9、可以看到访问已经被监听

image.png

二、req 请求对象

2.1、用于访问与客户端相关的数据或属性

/* 为服务器实例绑定 request 事件，监听客户端的请求 */
serve.on("request", (req, res) => {
  // req 是请求对象，它包含了与客户端相关的数据和属性，例如:
  // req.ur1 是客户端请求的 URL 地址
  // req.method 是客户端的 method 请求类型
  const str = `Your request url is ${req.url}, and request method is ${req.method}`;
  console.log(str);
});

2.2、浏览器访问127.0.0.1

image.png

2.3、浏览器访问127.0.0.1/index.html

image.png

2.4、利用postman测试post方式

image.png
image.png

三、res请求对象

3.1、res.end()方法

向客户端发送指定的内容，并结束这次请求的处理过程
每次修改代码记得重启一下服务

/* 为服务器实例绑定 request 事件，监听客户端的请求 */
serve.on("request", (req, res) => {
  // req 是请求对象，它包含了与客户端相关的数据和属性，例如:
  // req.ur1 是客户端请求的 URL 地址
  // req.method 是客户端的 method 请求类型
  const str = `Your request url is ${req.url}, and request method is ${req.method}`;
  // res.end()向客户端发送指定的内容，并结束这次请求的处理过程
  res.end(str);
});

3.2、postman测试

image.png

3.3、解决res.end()中文乱码问题

当调用res.end()方法，向客户端发送中文内容的时候，会出现乱码问题，此时，需要手动设置内容的编码格式

image.png

/* 为服务器实例绑定 request 事件，监听客户端的请求 */
serve.on("request", (req, res) => {
  // req 是请求对象，它包含了与客户端相关的数据和属性，例如:
  // req.ur1 是客户端请求的 URL 地址
  // req.method 是客户端的 method 请求类型
  const str = `您的请求地址为 ${req.url}, 请求方法为 ${req.method}`;
  // 为了防止中文显示乱码的问题，需要设置响应头 Content-Type 的值为 text/html; charset=utf-8
  res.setHeader("Content-Type", "text/html; charset=utf-8");
  // 把包含中文的内容，响应给客户端
  // res.end()向客户端发送指定的内容，并结束这次请求的处理过程
  res.end(str);
});

image.png
image.png

四、练习--根据不同的url响应不同的 html内容

/* 为服务器实例绑定 request 事件，监听客户端的请求 */
serve.on("request", (req, res) => {
  const url = req.url; // 1.获取请求的 ur1 地址
  let content = "<h1>404 Not found!</h1>"; // 2.设置默认的内容为 404 Not found
  if (url === "/" || url === "/index.html") {
    content = "<h1>首页</h1>"; // 3，用户请求的是首页
  } else if (url === "/about.html") {
    content = "<h1>关于页面</h1>";
  }
   // 5.设 (ontent-Type 响应头, 防上中文乱码
  res.setHeader("Content-Type", "text/html; charset=utf-8");
  res.end(content);
});

image.png
image.png
image.png