express的使用(一)

news2024/10/6 22:29:33

因为有时候没有登录CSDN,所以弄了一个订阅号，会不定时的更新文章(其实就是在csdn这边发布了之后搬过去，不过有问题的可以留言，csdn不常上来看)，欢迎订阅
文章链接：[订阅号-express的使用(一)]
------------------------------------------------------------------------------------

看前提示

本篇主要对于很小白的，废话很多

关于express

当使用Node.js进行开发，主要提供api服务的，轻便的，社区大,bug容易解决的，稳定的框架

基于Node.js平台，快速，开放，极简的Web开发框架

环境准备

node.js   16.15
nodemon   2.0.22
express   4.18.2

最主要的服务是express提供的，而nodemon是我们不需要每次更改代码后都重新启动一次，所以使用nodemon提供热更新~为了教学简便，不使用ts，防止增加他人学习成本

快速使用

在package中编写我们的启动指令,个人习惯用dev，所以便用dev来作为启动的指令

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev":"nodemon server.js"
  },

项目的入口文件，自然就是server.js了，在server.js中编写代码

const express = require("express");
const app = express();

app.get("/a", (req, res) => {
  console.log("开始调用a接口-1");
});
app.get("/a", (req, res) => {
    console.log("开始调用a接口-2");
  });
app.get("/b", (req, res) => {
  console.log("开始调用b接口");
});

app.listen(3000, () => {
  console.log("服务已启动");
});

运行结果如下，因为都是get请求，所以在浏览器中直接在地址栏中上依次输入以下的路径，即可在访问到我们的程序，也能在控制台中看到我们打印出来的日志

http://localhost:3000/a
http://localhost:3000/b

当然我这儿做了一个小测试，我们设置两个get都是请求a接口的时候，可以看到只打印了先注册的接口a-1，所以可以理解为在这种情况下，先注册的不会被后注册的代替

虽然app.listen以及app.get没有什么可讲的，但是依照惯例，对于初学者还是需要讲解下这两个。

app.get

express中对于指定的路径的get请求的监听

app.get(path, callback [, callback ...])

Routes HTTP GET requests to the specified path with the specified callback functions.

https://www.expressjs.com.cn/4x/api.html#express

既然监听了get请求，自然也有很常用的post/delete/put。不过就不一一测试了，相信我，后面的打工日子中，你多的是机会用到。

app.listen

对主机中的某个端口号进行监听

app.listen([port[, host[, backlog]]][, callback])

Binds and listens for connections on the specified host and port. This method is identical to Node’s http.Server.listen().

https://www.expressjs.com.cn/4x/api.html#express

路由模块

最简单的服务就这么启动了，但作为一个api服务，势必会有多个模块，不可能将全部的代码都堆在了我们的server.js中，也要提供一个路由模块，此时就需要用到express.Router了

关于路由的描述

路由器对象是中间件和路由的一个独立实例。您可以将其视为一个“迷你应用程序”，只能执行中间件和路由功能。每个Express应用程序都有一个内置的应用程序路由器。路由器的行为就像中间件本身，所以你可以将其用作app.use（）的参数，也可以用作另一个路由器的use（）方法的参数。

顶级express对象有一个Router（）方法，用于创建一个新的路由器对象。

一旦创建了路由器对象，就可以像应用程序一样向其添加中间件和HTTP方法路由（如get、put、post等）。

https://www.expressjs.com.cn/4x/api.html#router

假定现在情况是一个个人博客系统，那么我需要有一个博客模块，比如我根据id获取到博客的详情，外加一个用户模块，那么为了我们的模块能更加的清晰，就需要分别配置一个名为User以及blog的路由，分别提供这两个模块的访问，同时，用一个文件夹将两者包起来。那么，我们的项目结构会变成下面这种形式

而在其中的src/router/blog.js以及src/router/user.js则是编写我们的路由代码，举其中的user.js作为例子

const express = require("express");
const router = express.Router();

router.get("/getUserDetail", function (req, res, next) {
  console.log("获取用户的详情");
});

module.exports = {
  userRouter: router,
};

第二行中使用到了express.Router(),创建一个新的路由对象，监听了getUserDetail这个api,并将其导出去，在server.js中使用use方法进行合并（use方法在讲中间件的时候再说）

const express = require("express");const app = express();
const {blogRouter} = require("./src/router/blog");const {userRouter} = require("./src/router/user");
app.listen(3000, () => {  console.log("服务已启动");});app.use("/blog", blogRouter);
app.use("/user", userRouter);

在路由器中访问：

http://localhost:3000/user/getUserDetail

即可看到如下的效果

request与response

至此，一个最最简单，而且看起来勉强规范的express项目就理解了，但是还有一点，我们会在浏览器看到一直在转圈圈，这是因为我们没有返回到前端任何的数据，所以整个http的流程还没结束，在一个http请求中，我们需要关注的是Request以及Response。以下面的这个最简单的代码为例

router.get("/getUserDetail", function (req, res, next) {
  console.log("获取用户的详情");
});

既然提到了request 对象以及response对象，我们需要看下官网中对于这两个对象的描述

request对象

Request The req object represents the HTTP request and has properties for the request query string, parameters, body, HTTP headers, and so on.

根据文档，实际上就是http请求的request，那么。我们现在假定请求的链接为

http://localhost:3000/user/getUserDetail?id=1

当前的代码如下:

const express = require("express");
const router = express.Router();

router.get("/getUserDetail", function (req, res, next) {
  const { query = {}, method = "" } = req;
  console.log("req对象中的query是=========>");
  console.log(query);
  console.log("req对象中的methods是=========>");
  console.log(method);
});

module.exports = {
  userRouter: router,
};

打印出来的自然是：

这一块就没啥好说的了，对于http不怎么熟悉的。我之前的博客有相关的介绍，我觉得可以去看下。

response对象

Response The res object represents the HTTP response that an Express app sends when it gets an HTTP request.

根据文档，自然就是http请求中的response了，也就是我们用来返回给前端的信息。而在express的github的代码中，也有

 res.send('Hello World')

因此我们就大胆的加上去试试

router.get("/getUserDetail", function (req, res, next) {
  const { query = {}, method = "" } = req;
  console.log("req对象中的query是=========>");
  console.log(query);
  console.log("req对象中的methods是=========>");
  console.log(method);
  res.send('找不到这个用户');
});

效果图如下：