介绍
Express是 Node.js 的 Web 应用框架,允许您以更简单、更清洁的方式创建强大的 API 和 Web 服务器。
在本文中,您将安装并使用 Express 来构建 Web 服务器。
前提条件
如果您想跟随这篇文章,您将需要:
- Node.js 的本地开发环境 遵循 如何安装 Node.js 并创建本地开发环境。
本教程已通过 Node v15.14.0、npm v7.10.0、express v4.17.1 和 server-index v1.9.1 进行验证。
步骤1 - 设置项目
首先,打开终端窗口并创建一个新的项目目录:
1mkdir express-example
然后,导航到新创建的目录:
1cd express-example
在此时刻,您可以启动一个新的 npm 项目:
1npm init -y
接下来,您需要安装快递包:
1npm install [email protected]
在此时刻,你有一个新的项目准备使用Express。
步骤2:创建一个快递服务器
现在,Express已安装,创建一个新的server.js文件,并使用代码编辑器打开它,然后添加以下代码行:
1[label server.js]
2const express = require('express');
3
4const app = express();
这里的第一行是从您安装的包中抓取主 Express 模块. 这个模块是一个功能,然后我们在第二行运行,以创建我们的app变量。
1[label server.js]
2const express = require('express');
3
4const app = express();
5
6app.get('/', (req, res) => {
7 res.send('Successful response.');
8});
这些代码行是我们告诉我们的Express服务器如何处理向我们的服务器发送的GET请求的地方。Express包括类似的功能,用于POST,PUT等,使用app.post(...),app.put(...)等。
这些函数需要两个主要参数,第一个是该函数的URL,在这种情况下,我们正在瞄准‘’/’,这是我们网站的根源:在这种情况下,‘localhost:3000’。
第二个参数是具有两个参数的函数:req和res。req代表向服务器发送的请求;我们可以使用这个对象来读取客户端请求的数据。
在这里,我们在 res 上调用一个函数来发送回复:成功回复。
1[label server.js]
2const express = require('express');
3
4const app = express();
5
6app.get('/', (req, res) => {
7 res.send('Successful response.');
8});
9
10app.listen(3000, () => console.log('Example app is listening on port 3000.'));
最后,一旦我们设置了我们的请求,我们必须启动我们的服务器!我们将3000传入倾听函数,该函数告诉应用程序哪个端口要听。
查看您的终端窗口并运行您的应用程序:
1node server.js
然后,在您的 Web 浏览器中访问localhost:3000。 您的浏览器窗口将显示成功响应,您的终端窗口将显示示例应用程序正在倾听 3000 端口。
然后我们有它,一个网页服务器! 然而,我们绝对想向客户端发送更多的单行文本. 让我们简要介绍中间件是什么以及如何将这个服务器设置为静态文件服务器!
步骤三:使用中间件
借助Express,我们可以编写和使用 middleware 函数,这些函数可以访问到服务器的所有HTTP请求。
- 执行任何代码
- 对请求和响应对象进行更改
- 结束请求响应周期
- 在堆栈中调用下一个中间件函数
我们可以编写自己的中间件功能或使用第三方中间件,以与任何其他包一样导入它们。
让我们从写自己的中间件开始,然后我们将尝试使用一些现有的中间件来服务静态文件。
要定义中间件函数,我们称之为app.use(),并将其传递为一个函数. 以下是一项基本的中间件函数,可在每个请求时在控制台中打印当前时间:
1[label server.js]
2const express = require('express');
3
4const app = express();
5
6app.use((req, res, next) => {
7 console.log('Time: ', Date.now());
8 next();
9});
10
11app.get('/', (req, res) => {
12 res.send('Successful response.');
13});
14
15app.listen(3000, () => console.log('Example app is listening on port 3000.'));
next()呼叫告知中间件如果有下一个中间件函数,则转到下一个中间件函数。
我们可以选择将路径转移到中间件,它只会处理该路径的请求。
1[label server.js]
2const express = require('express');
3
4const app = express();
5
6app.use((req, res, next) => {
7 console.log('Time: ', Date.now());
8 next();
9});
10
11app.use('/request-type', (req, res, next) => {
12 console.log('Request type: ', req.method);
13 next();
14});
15
16app.get('/', (req, res) => {
17 res.send('Successful response.');
18});
19
20app.listen(3000, () => console.log('Example app is listening on port 3000.'));
通过将 ''/request-type' 作为第一个参数传输到 'app.use()',此函数只会对发送到 'localhost:3000/request-type' 的请求运行。
查看您的终端窗口并运行您的应用程序:
1node server.js
然后,在您的网页浏览器中访问localhost:3000/request-type。您的终端窗口将显示请求的时刻印和请求类型:GET。
现在,让我们尝试使用现有的中间件来服务静态文件。Express 配备了内置的中间件功能: express.static.我们还将使用第三方中间件功能, serve-index,来显示我们的文件的索引列表。
首先,在即时服务器所在的相同文件夹中,创建一个名为公共的目录,并将一些文件放入其中。
然后,安装包 serve-index:
1npm install [email protected]
首先,导入服务器文件顶部的serve-index包。
然后,包括express.static和serveIndex中间件,并告诉他们访问路径和目录的名称:
1[label server.js]
2const express = require('express');
3const serveIndex = require('serve-index');
4
5const app = express();
6
7app.use((req, res, next) => {
8 console.log('Time: ', Date.now());
9 next();
10});
11
12app.use('/request-type', (req, res, next) => {
13 console.log('Request type: ', req.method);
14 next();
15});
16
17app.use('/public', express.static('public'));
18app.use('/public', serveIndex('public'));
19
20app.get('/', (req, res) => {
21 res.send('Successful response.');
22});
23
24app.listen(3000, () => console.log('Example app is listening on port 3000.'));
现在,重新启动您的服务器,并导航到localhost:3000/public。
结论
在本文中,您安装并使用 Express 来构建 Web 服务器,您还使用了内置和第三方中间件功能。
继续学习如何在 Express 中使用 req 对象(https://andsky.com/tech/tutorials/nodejs-req-object-in-expressjs),如何在 Express 中使用 res 对象(https://andsky.com/tech/tutorials/nodejs-res-object-in-expressjs),以及如何在 Express 中定义路线和 HTTP 请求方法(https://andsky.com/tech/tutorials/nodejs-express-routing)。