Node.jsExpress框架的基本使用

Posted 2023-04-02 坚毅的小解同志

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Node.jsExpress框架的基本使用相关的知识，希望对你有一定的参考价值。

✍️ 作者简介: 前端新手学习中。
💂 作者主页: 作者主页查看更多前端教学
🎓 专栏分享：css重难点教学 Node.js教学从头开始学习

初识Express

Express简介

什么是Express

官方给出的概念：Express是基于Node.js平台，快捷，开放，极简的Web开发框架

通俗的理解，Express的作用和Node.js内置的http模块类似，是专门用来创建Web服务器的。

Express的本质：就是一个npm上的第三包，提供了快速创建Web服务器的便捷方法。

Express的中文官网：express官网

进一步理解 Express

Express的开发效率更高，http内置模块用起来很复杂，开发效率低，Express是基于内置的http模块进一步封装出来的。能够极大地提高开发效率。

http内置模块与Express类似于WebAPI和jquery的关系，后者是基于前者进一步封装出来的

Express能做什么

对于前端程序员来说，最常见的两种服务器，分别是：

Web网站服务器：专门对外提供Web网页资源的服务器。
API接口服务器：专门对外提供API接口的服务器。

使用Express，我们可以方便，快捷的创建Web网站的服务器或API接口的服务器。

Express的基本使用

安装

在项目所处的根目录中，运行如下的终端命令，就可以安装express到项目中使用。

npm i express@4.17.1

尽量安装指定版本避免后面有什么不一样的出错

创建基本的Web服务器

使用npm下载完第三方包之后，使用expres创建服务器

//导入express
const express = require('express');
//创建Web服务器
const app = express();
//监听服务器
app.listen(8080, () => 
    console.log('服务器创建成功');
)

监听GET请求

通过app.get（），方法监听客户端的GET请求。

//监听get请求
app.get('/user', (req, res) => 
    //res.sen方法向客户端响应数据
    res.send(
        name: 'xiaoxie',
        age: 20,
        gender: '男'
    )
)

启动服务器在postCode中输入地址发送get请求，拿到数据。

监听post请求

通过app.post（）方法，可以监听客户端的post请求。

app.post('/user', (req, res) => 
    res.send('请求成功')
)

获取URL中携带的查询参数

通过req.query对象，可以访问到客户端通过查询字符串的形式，发送到服务器的参数：

就是将ajax中通过serialize()方法得到的键值对字符串转换成对象。

app.get('/', (req, res) => 
    //默认情况下 是一个空对象
    console.log(req.query);
    res.send(req.query);
)

在地址栏问号后面写，跟再params里写是一样的。

获取URL中的动态参数

通过req.params对象，可以访问到URL中，通过：匹配动态参数，冒号是固定写法表示后面是动态参数，显示名称id可以自定义任何名称。

app.get('/user/:id/:name', (req, res) => 
    //默认情况下 是一个空对象
    console.log(req.params);
    res.send(req.params);
)

初始Express

托管静态资源

express.static()

express提供了一个非常好用的函数，叫做express.static（），通过它，我们可以非常方便地创建一个静态资源管理器，例如，通过以下代码就可以将public目录下的图片，CSS文件，javascript文件，对外开放访问了。

我们将前面的时钟案例，clock文件夹对外开放。

// 将clock目录对外开放

//导入express

const express = require('express');
//实例化
const app = express();
//使用express.static（）方法，快速对外提供静态资源
app.use(express.static('./时钟/clock'))


//监听
app.listen(8080, () => 
    console.log('访问成功 地址为http://127.0.0.1:8080');
)

直接在路径栏里进行访问，访问的时候文件夹需要省略，直接写文件名即可。

如果挂载多个文件夹，且有相同的文件名，咋按从上到下书写的先后顺序来显示第一个文件。

挂载路径前缀

我们可以在地址栏访问指定文件前，可以加上伪装的文件夹名。

这个abc 并不是真实存在的文件夹，只是在地址栏访问时，必须需要加上这个前缀名。

app.use('abc', express.static('./时钟/clock'))

nodemon

为什么要使用nodemon

在编写测试Node.js项目的时候，如果修改了项目的代码，则需要频繁的手动close掉，然后重复启动，非常繁琐，现在，我们可以使用nodemon这个工具，他能够监听项目文件的变动，当代码被修改后，nodemon会自动帮我们重启项目，极大方便了开发和测试。

安装 nodemon

全局安装nodemon。

npm i nodemon -g

使用nodemon

nodemon 文件名

运行之后，只要修改文件保存后，就会自动重启项目。

Express 路由

路由的概念

什么是路由

广义上来讲，路由就是映射关系。

现实生活中的路由

Express中的路由

在Express中，路由指的是客户端的请求与服务器处理函数之间的映射关系。

Express中的路由分3部分组成，分别是请求的类型，请求的URL地址，处理函数。

路由的匹配过程

每当一个请求到达服务器之后，需要先经过路由的匹配，只有匹配成功之后，才会调用对应的处理函数。

在匹配时，会按照路由的顺序进行匹配，如果请求类型和请求的URL同时匹配成功，则Express会将这次请求，转交给对应的function函数进行处理。

路由的使用

最简单的用法

在Express中使用路由器最简单的方式，就是把路由挂载到app上。

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

app.get('/', (req, res) => 
    res.send('hello world')
)

app.post('/', (req, res) => 
    res.send('hello post')
)

app.listen(8080, () => 
    console.log('http:127.0.0.1:8080');
)

模块化路由

为了方便对路由进行模块化的管理，EXpress不建议将路由直接挂载到app上，而是推荐将路由抽离为单独的模块。

将路由抽离为单独模块的步骤如下：

创建路由模块对应的js文件
调用express.Router（）函数创建路由对象
向路由对象上挂载具体的路由
使用module.exports向外共享路由对象
使用app.use（）函数注册路由模块

创建路由模块

在一个新js文件里创建路由模块并向外暴露。

//这是路由模块


//导入express
const express = require('express');
//创建路由对象
const router = express.Router();

//挂载具体的路由

router.get('/user/list', (req, res) => 
    res.send('Get user list')
)

router.post('/user/add', (req, res) => 
    res.send('Add new user');
)

//向外曝光路由对象
module.exports = router;

导入并注册路由模块。

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

//导入路由模块
const router = require('./route.js')
//注册路由模块
app.use(router);

app.listen(8080, () => 
    console.log('http:127.0.0.1:8080');
)

注意 app.use的作用就是用来注册全局中间件

为路由模块添加访问前缀

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

//导入路由模块
const router = require('./route.js')
//注册路由模块
//添加前缀
app.use('/api', router);

app.listen(8080, () => 
    console.log('http:127.0.0.1:8080');
)

Express中间件

中间件的概念

什么是中间件

中间件，特指业务流程的中间处理环节。

现实生活中的例子

在处理污水的时候，一般都要经过三个处理环节，从而保证处理过后的废水，达到排放标准。

Express中间件的调用流程

当一个请求到达Express的服务器之后，可以连续调用多个中间件，从而对这次请求进行预处理。

Express中间件的格式

Express的中间件，本质上就是一个function处理函数，Express中间件的格式如下：

注意：中间件函数的形参列表中，必须包含next参数。而路由处理函数中只包含req和res。

next函数的作用

next函数是实现多个中间件连续调用的关键，它表示把流转关系转交给下一个中间件或路由。

Express中间件的初体验

定义中间件函数

可以通过如下的方式，定义一个最简单的中间件函数

const express = require('express');

const app = express();

//定义一个简单的中间件函数

const mw = function (req, res, next) 
    console.log('这是最简单的中间件函数');
    //把流转关系转交给下一个中间件
    next()



app.listen(8080, () => 
    console.log('http://localhost:8080');
)

触发使用中间件函数

客户端发起的任何需求，到达服务器之后，都会触发的中间件，叫做全局生效的中间件。

通过调用app.use（中间件函数），即可定义一个全局生效的中间件。

//定义一个简单的中间件函数

const mw = function (req, res, next) 
    console.log('这是最简单的中间件函数');
    //把流转关系转交给下一个中间件
    next()


//全局生效的中间件
app.use(mw)

Node.js Express 中的异步代码

【中文标题】Node.js Express 中的异步代码【英文标题】：Asynchronous code in Node.js Express 【发布时间】：2017-02-04 03:43:28 【问题描述】：

我正在尝试使用 Node.js Express 创建 MVC 模式，但这在执行异步代码时似乎是一项非常不可能的任务。

例如：我从模型中的 NeDB 数据库中获取结果，如下所示：

controllers/database.js

// Database management stuff with NeDB
var data = ;
db.findOne( _id: 1 , (error, doc) => 
    if (error) console.error(error);
    data = doc;

现在，我将在一个名为 dbcontroller.js 的控制器中使用它：

var nedb = require('../models/nedb.js');

module.exports.list = function(req, res, next) 
    res.render('listpage', 
        data: nedb.data,
    );

在 routes/routes.js 文件中：

var express = require('express');
var router = express.Router();
var dbcontroller = require('../controllers/dbcontroller.js');
// Other controllers...

router.get('/list', dbcontroller.list);
// Other route definitions...

module.exports = router;

很可爱的安排，不是吗？现在，果然，NeDB 的 findOne() 函数是异步的，所以它会在 module.exports 之后执行，而那是不行的。想到的解决方案当然是将 module.exports 定义放在 findOne() 回调中！

db.findOne( _id: 1 , (error, doc) => 
    if (error) console.error(error);
    module.exports.data = data;

我确定这是某个地方的反模式，但它确实有效。或者是吗？真正的戏剧现在开始。

当它被控制器调用时，findOne() 函数也会在所有控制器逻辑之后完成，这意味着 nedb.data 将是未定义的。我现在必须做一些疯狂的特技......

database.js

module.exports.execute = function (callback) 
    db.findOne( _id: 1 , (error, doc) =>
    
        if (error) console.error(error);
        module.exports.data = doc;
        callback();
    );

dbcontroller.js：

nedb.execute(export);

function export() 
    module.exports.list = function(req, res, next) 
        res.render('listpage', 
            data: nedb.data,
        );
    ;
;

而且情况变得更糟。 routes.js 文件现在找不到 dbcontroller.list，大概是因为它仍然是在之后定义的路线要求它。现在，我是否也必须开始将路由定义放入回调中？

我的意思是，整个异步性似乎完全接管了我的代码结构。以前整洁的代码现在变得一团糟，因为我无法将代码放在它所属的地方。这只是一个异步函数，NeDB 有很多异步函数，虽然这很棒，但如果 findOne() 已经让我很头疼，我不知道我是否能处理它。

也许我真的别无选择，我必须弄乱我的代码才能让它工作？或者也许我错过了一些非常基本的东西？或者也许像 async 或 promises 这样的库会做我正在寻找的东西？你怎么看？

【问题讨论】：

【参考方案1】：

为了使异步代码工作，您需要通过回调、承诺或其他方式通知您何时完成。要使上述示例正常工作，您需要做的就是调用res.render，您确定data 已定义。为此，您可以从数据库获取中返回一个 Promise，或者向它传递一个回调。我建议使用 Promise，因为它们更容易使用，因为它们有助于避免 "callback hell"，而且 Node 长期以来一直对它们提供原生支持。

controllers/database.js

module.exports.fetch = function() 
  return new Promise(function(resolve, reject) 
    db.findOne( _id: 1 , (error, doc) => 
      if (error) reject(error);
      resolve(doc);
   );

然后，在您的控制器中，您只需在呈现响应之前调用 fetch（或者您最终定义数据库获取代码）。

dbcontroller.js

var nedb = require('../models/nedb.js');

module.exports.list = function(req, res, next) 
  nedb.fetch().then((data) => 
    res.render('listpage', 
        data: nedb.data,
    );
  ).catch((err) =>  /* handle db fetch error */ );

要记住的是，express 不希望您立即致电 res.render。您可以执行大量异步代码，然后在完成后呈现响应。

【讨论】：

这并不是一个很好的例子，说明 Promise 比回调“容易得多”。你可以用更少的代码用回调做同样的事情。我没有 -1 你，但老实说，如果你放弃风格意见或证明为什么它更好，你的答案会更好。如果你注意到这个问题，这不是关于回调与承诺的问题。我并没有试图证明承诺“容易得多”。但是 javascript 社区非常同意他们对“回调地狱”的帮助。这就是为什么他们有本地支持。问题是问什么异步方法会导致代码更简洁，我只是给出了我的意见。是的，很明显，如果你只有两个函数，回调将是更少的代码。但问题是关于为应用构建 MVC。这就是为什么我没有 -1 你。我只是认为，如果不引入辩论并做出不受支持的断言，您的答案会更好。我引用了这个问题。 “或者也许像 async 或 Promise 这样的库会做我正在寻找的东西？你怎么看？”针对这个简单的问题，我回答说“我建议使用 Promise”。如果我改用回调，并注意到我的代码与现代实践有多么不兼容，你会感到不安吗？只是说，我不觉得这是有成效的。我并不难过，伙计，我只是建议一种方法来改进您的答案。如果你不想这样做，那就这样吧。但您似乎更容易接受我的建议，例如添加一个示例，说明为什么 Promise 方法更适合他的场景，或者忽略它，而不是对我的评论进行无效的辩护。我并没有说你对 Promises 的看法是错误的，只是如果你向这位新开发者展示为什么你的断言是正确的，你的例子会更好。【参考方案2】：

在回调函数中设置模块数据通常是不好的做法，因为require 会同步加载模块。在模块之间传递 ES6 Promises 是消除过多回调需求的一种可能选择。

database.js

module.exports = new Promise(function (resolve, reject) 
    db.findOne( _id: 1 , (error, doc) => 
        if (error) reject(error);
        resolve(doc);
    );
);

dbcontroller.js

var nedb = require('../models/nedb.js');

module.exports.list = nedb.then(data => 
    return (req, res, next) =>  //return router callback function
        res.render('listpage',  data ) //ES6 shorthand object notation
    
).catch(/* error handler */);

可以在这个答案中找到进一步的指导：Asynchronous initialization of Node.js module

【讨论】：

我遇到的问题是 require()d 的代码以某种方式异步工作。我认为这不会发生，因为 require() 是同步的（如您向我展示的答案中所述），并且 node.js 在实际文件中启动代码之前加载整个模块确实很有意义......但仍然， database.js 中将数据加载到控制器的代码与控制器本身并行运行。我的 node.js 是否以某种方式损坏了？我能解释的最佳方式：您的 database.js 正在导出一个 function 对象，该对象同步加载到 dbcontroller.js 中而不执行（否则nedb.execute(export) 行将返回 cannot find property 'execute' of undefined)。当database.js 函数通过dbcontroller.js 中的回调执行时，尽管已经定义了函数，但数据库获取仍然是异步。因此，跨模块需要多个回调/承诺。我不能相信模块在当前代码之前完全加载，这太疯狂了。我想知道模块创建者如何避免让用户为他们的模块工作进行随机回调。

以上是关于Node.jsExpress框架的基本使用的主要内容，如果未能解决你的问题，请参考以下文章

Node.jsExpress搭建服务端应用及接收请求参数

成功登录后的 Node.js Express 无限重定向循环

实用教程丨如何将实时数据显示在前端电子表格中

无法在我的 Node.js Express.js 应用程序中设置路由

Node.js Express 中的异步代码

如何使用 node-inspector 调试 nodeunit