Node.js（二）

实现服务器步骤和核心代码

1. 导入 http 模块

   const http = require('http')  // Node 自带核心内置模块
   

2. 创建 web服务器实例

   // 调用 http.createServer() 方法，即可快速创建一个 web 服务器实例
   
   const server = http.createServer() 
   

3. 为服务器实例绑定 request 事件

   // 为服务器实例绑定 request 事件，即可监听客户端发送过来的网络请求
   
   // 使用服务器实例的 .on() 方法，为服务器绑定一个 request 事件
   server.on('request', (req, res) => {
     // 只要有客户端来请求我们自己的服务器，就会被触发 request 事件，从而调用这个事件处理程序
     console.log('访问服务器成功')
   })
   

4. 启动服务器

   // 调用服务器实例的 .listen() 方法，即可启动当前的 web 服务器实例
   //设置 端口 3000 
   server.listen(3000，=> {
       console.log('running……')
   })
   

5. 注意

   1.如果终端关闭就相当于 web服务关闭了
   2.ctrl+c 停止当前的进程
   3.前端请求的内容是中文乱码 需要 设置响应头res.setHeader('Content-Type', 'text/html;      charset=utf-8')
   

创建基本的服务器

// 1. 导入 http 模块
const http = require('http')

// 2. 创建 web 服务器实例
const server = http.createServer()

// 3. 为服务器实例绑定 request 事件，监听客户端的请求
server.on('request', function (req, res) {
  console.log('访问服务器成功')
})

// 4. 启动服务器
server.listen(8080, function () {  
  console.log('running……')
})

// 为了防止中文乱码问题，需要设置响应头，
  res.setHeader('Content-Type', 'text/html; charset=utf-8')

req请求对象 （ request ）

服务器 后台接收到前端的请求，就会调用 server.on为服务器绑定 request事件处理程序，监听前端发送的请求。如果想在事件处理程序中，访问与客户端相关的数据与属性，可以使用如下方式：

server.on('request', function (req, res) {
  // req 是请求对象，它包含了与客户端相关的数据和属性
  // req.url 获取客户端请求的 url 地址
  // req.method 获取客户端请求的类型

  const str = `${req.url} -- ${req.method}`

  console.log(str)
})

res响应对象（response）

在服务器的 request 事件处理程序中，如果想访问与服务器相关的数据和属性，可以使用如下方式

res响应对象给前端 所携带的内容有如下

• 响应对象，服务器给浏览器返回的响应内容，可以通过该对象设置
• res.setHeader() 设置响应头，响应内容格式和编码
• res.statusCode 设置状态码
• res.end() 把响应报文（响应行、响应头、响应体）发送给浏览器

server.on('request', function (req, res) {
  // res 是响应对象，它包含了与服务器相关的数据和属性
  // 例如：将字符串发送到客户端

  const str = `${req.url} -- ${req.method}`
  
  // res.end() 方法的作用
  // 向客户端发送指定的内容，并结束这次请求的处理过程
  res.end(str)
})

解决中文乱码问题

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

server.on('request', function (req, res) {
  // 发送包含中文的内容
  const str = `您请求的 url 地址是：${req.url}，请求的 method 类型是：${req.method}`

  // 为了防止中文乱码问题，需要设置响应头，
  res.setHeader('Content-Type', 'text/html; charset=utf-8')

  // 把包含中文的内容返回给客户端
  res.end(str)
})

请求对象_GET方式_

server.on('request', function (req, res) {  
  // 形参req 是 请求request的意思，所有和请求相关的信息，都在req对象中
})

• 形参 req

  • 请求对象，浏览器发送的请求报文中的数据已经被解析到该对象上
  • req.url 获取请求行中的路径
  • req.method 获取请求行中的方式
  • req.headers 获取请求头数据

• 代码实例

  const http = require('http');
  
  const server = http.createServer();
  
  server.on('request', (req, res) => { 
      console.log(req.method); // 获取前端使用的请求方式   GET
      console.log(req.url); // 获取前端使用的请求地址(从域名和端口往后的部分)   /?a=10&b=20&c=30
      console.log(req.headers); // 获取前端使用的请求头  
      res.end(); 
  });
  
  server.listen(3000, () => {
      console.log('服务器启动了');
  });
  

请求对象-POST方式 -接参数

const http = require('http');

const server = http.createServer();

server.on('request', (req, res) => {
    console.log(req.method); // POST
    console.log(req.url); 
    console.log(req.headers);

    // 接受参数
    let str = ''; // 定义一个用于保存数据的空字符串
    req.on('data', (chunk) => { // 给req注册data事件，只要有数据提交过来，就会触发；用于接收提交过来的数据(数据过大, 会多次触发, 接收字节)
        str += chunk; // 拼接到变量上
    });
    req.on('end', () => { // 给req注册end事件，当完全接收了提交过来的数据，就会触发
        console.log(str); // a=10&b=20&c=30
    });
    res.end(str);
});
// 前端请求插件: 发送POST请求和参数 a=10&b=20&c=30
server.listen(3000, () => {
    console.log('服务器启动了');
});

小结

req.url    //获取请求行中的路径
req.method  //获取请求行中的方式
req.headers  //获取请求头数据 
res.setHeader()  //设置响应头，响应内容格式和编码
res.statusCode  //设置状态码
res.end()     //把响应报文（响应行、响应头、响应体）发送给浏览器
res.setHeader('Content-Type', 'text/html; charset=utf-8')  // 为了防止中文乱码问题，需要设置响应头，

接口编写

需求: 后端监测前端发送的请求方式, 以及请求的url, 以及请求的参数

功能: GET /api/list 后台把数据返回给前端

功能: POST /api/add 前端把参数key=value&key=value字符串发到后台, 保存到数组里

const http = require('http');
const querystring = require("querystring");
const server = http.createServer();

let arr = []; // 不要写在下面的函数里, 不然每次请求都会初始化, 但是这个js重启代码会重新执行清空数组

server.on('request', (req, res) => {
    let { method, url } = req; // 提取请求方式, 和请求地址
    res.setHeader("Content-Type", "text/html; charset=utf-8;"); // 设置响应头, 返回的是中文

    // 1. GET方式 - 查询所有数据
    if (method == "GET" && url == "/api/list") {
        res.end(JSON.stringify({ // 把数据响应回给前端
            status: 200,
            msg: "获取成功",
            data: arr
        }));
    } else if (method == "POST" && url == "/api/add") { // 接收前端发来的数据, 组织格式保存到数组里
        // POST方式 - 添加数据到arr数组里 (要求前台传递一个JSON字符串数据)
        let str = '';
        req.on('data', (chunk) => {
            str += chunk;
        });
        req.on('end', () => {
            // 直接用queryString可以把key=value&key=value字符串转成对象格式
            let obj = querystring.parse(str.replace("?", ""));
            arr.push(obj); // 把发来的数据对象保存到全局 数组里
            res.end(JSON.stringify({
                status: 201,
                msg: "添加成功"
            }));
        });
    } else {
        res.end("请确认接口地址和对应的请求方式是否正确");
    }
});

server.listen(3000, () => {
    console.log('服务器启动了, http://127.0.0.1:3000');
});

「点赞、收藏和评论」

❤️关注+点赞+收藏+评论+转发❤️，鼓励笔者创作更好的文章，谢谢?大家。