实现当get请求和post请求接口,如果请求接口有错,返回的内容是定义好的html代码,内容是404图片

469 阅读1分钟

本文要做的是引入http创建服务,用post get请求接口,如果请求成功,正常返回,postman中测试也正常,如果不成功,返回的是404图片。

get请求和post请求看之前的2篇。

本文重点来写当请求接口有错的时候的返回。

先定义一段html代码,渲染内容是404图片,并合并成一行,方便在res.end()中使用。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      * {
        padding: 0;
        margin: 0;
      }
      img {
        width: 100%;
      }
    </style>
  </head>
  <body>
    <img
      src="https://markdown-1253389072.cos.ap-nanjing.myqcloud.com/202203191544993.png"
      alt=""
    />
  </body>
</html>

引入服务,用post,get请求

// index.js
const http = require("http");
// 引入自带的querystring,这是一个方法
const qurerystring = require("querystring");
const server = http.createServer((req, res) => {
  const url = req.url;
  const method = req.method;
  // 获取请求的路径
  const path = url.split("?")[0];
  // 获取请求的querystring
  const queryStr = url.split("?")[1];
  // querystring转对象
  // 用引入的qureystring模块 把split转出来的参数数组转成字符串 qurerystring.parse(queryStr)
  //把这转出来的放到对象里面去
  const queryObj = qurerystring.parse(queryStr);

  if (path === "/api/list" && method === "GET") {
    // res.end(`您正在请求留言板列表接口! 将返回${queryObj.number}条留言!`);
 
  } else if (url === "/api/create" && method === "POST") {
    res.end("this is create api menthod is POST");

  } else {
// 响应体,返回的格式是html
res.writeHead(404,{"Content-type":"text/html"})
// 返回内容,是已经写好的html代码,html里面有双引号,所以res.end()最外层用单引号
res.end('<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> * { padding: 0; margin: 0; } img { width: 100%; } </style> </head> <body> <img src="https://markdown-1253389072.cos.ap-nanjing.myqcloud.com/202203191544993.png" alt="" /> </body> </html>')
  }
});
server.listen(3000);
console.log("http请求已经被监听, 3000端口, 请访问: http://localhost:3000");


在postman中预览如下

image.png