如何开始使用Node.js和Express

介绍

Express是一个用于 Node.js 的 Web 应用框架，它使您能够以更轻松、更清晰的方式启动强大的 API 和 Web 服务器。它是一个轻量级的包，不会混淆核心的 Node.js 特性。

在本文中，您将安装并使用 Express 来构建一个 Web 服务器。

先决条件

如果您想跟着本文学习，您需要：

• A local development environment for Node.js. Follow How to Install Node.js and Create a Local Development Environment.

本教程已使用 Node v15.14.0、npm v7.10.0、express v4.17.1 和 serve-index v1.9.1 进行验证。

步骤 1 — 设置项目

首先，打开您的终端窗口并创建一个新的项目目录：

mkdir express-example

然后，切换到新创建的目录：

cd express-example

此时，您可以初始化一个新的 npm 项目：

npm init -y

接下来，您需要安装 express 包：

npm install express@4.17.1

到此为止，您已经准备好使用 Express 的新项目了。

步骤2 — 创建一个Express服务器

现在Express已经安装完成，创建一个新的server.js文件并用你的代码编辑器打开它。然后，添加以下代码行：

const express = require('express');

const app = express();

这里的第一行是从你安装的包中获取主要的Express模块。这个模块是一个函数，然后我们在第二行运行它来创建我们的app变量。你可以用这种方式创建多个应用程序，每个应用程序都有自己的请求和响应。

const express = require('express');

const app = express();

app.get('/', (req, res) => {
  res.send('Successful response.');
});

这些代码行是我们告诉Express服务器如何处理对我们服务器的GET请求。Express包括类似的函数用于POST、PUT等，使用app.post(...)、app.put(...)等。

这些函数有两个主要参数。第一个是这个函数要操作的URL。在这种情况下，我们针对'/'，这是我们网站的根：在这种情况下，localhost:3000。

第二个参数是一个具有两个参数的函数：req和res。req表示发送到服务器的请求；我们可以使用这个对象读取客户端请求的数据。res表示我们将发送回客户端的响应。

在这里，我们调用res上的一个函数来发送一个响应：'成功的响应。'。

const express = require('express');

const app = express();

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

最后，一旦我们设置了请求，我们必须启动服务器！我们将 3000 传递给 listen 函数，这告诉应用程序要监听的端口。作为第二个参数传递的函数是可选的，在服务器启动时运行。这为我们提供了一些反馈，以便在控制台中知道我们的应用正在运行。

重新打开您的终端窗口并运行您的应用程序：

node server.js

然后，在您的网络浏览器中访问 localhost:3000。您的浏览器窗口将显示：'成功的响应'。您的终端窗口将显示：'示例应用正在端口3000上监听.'。

这就是我们的网页服务器！但是，我们肯定想向客户端发送不止一行文本。让我们简要介绍一下中间件是什么以及如何将此服务器设置为静态文件服务器！

步骤3 — 使用中间件

使用 Express，我们可以编写和使用 中间件 函数，这些函数可以访问到所有发送到服务器的 HTTP 请求。这些函数可以：

• 执行任何代码。
• 对请求和响应对象进行更改。
• 结束请求-响应周期。
• 调用堆栈中的下一个中间件函数。

我们可以编写自己的中间件函数或者使用第三方中间件，方式与导入其他包相同。

让我们首先编写我们自己的中间件，然后尝试使用一些现有的中间件来提供静态文件。

要定义一个中间件函数，我们调用app.use()并传递一个函数。这是一个在每个请求期间在控制台打印当前时间的基本中间件函数：

const express = require('express');

const app = express();

app.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

next()调用告诉中间件如果有下一个中间件函数就继续执行。这一点很重要，要在我们的函数末尾包含它 – 否则，请求将在此中间件上卡住。

我们可以选择性地传递一个路径给中间件，这将仅处理该路由的请求。例如：

const express = require('express');

const app = express();

app.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});

app.use('/request-type', (req, res, next) => {
  console.log('Request type: ', req.method);
  next();
});

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

通过将'/request-type'作为第一个参数传递给app.use()，这个函数将仅对发送到localhost:3000/request-type的请求运行。

重新打开您的终端窗口并运行您的应用程序：

node server.js

然后，在您的Web浏览器中访问localhost:3000/request-type。您的终端窗口将显示请求的时间戳和'Request type: GET'。

现在，让我们尝试使用现有的中间件来提供静态文件。Express自带一个内置的中间件函数：express.static。我们还将使用一个第三方中间件函数：serve-index，来显示我们文件的索引列表。

首先，在与express服务器位于同一文件夹内，创建一个名为public的目录，并将一些文件放在其中。

然后，安装包serve-index：

npm install serve-index@1.9.1

首先，在服务器文件顶部导入serve-index包。

然后，包括express.static和serveIndex中间件，并告诉它们要访问的路径和目录名称：

const express = require('express');
const serveIndex = require('serve-index');

const app = express();

app.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});

app.use('/request-type', (req, res, next) => {
  console.log('Request type: ', req.method);
  next();
});

app.use('/public', express.static('public'));
app.use('/public', serveIndex('public'));

app.get('/', (req, res) => {
  res.send('Successful response.');
});

app.listen(3000, () => console.log('Example app is listening on port 3000.'));

现在，重新启动您的服务器并导航至localhost:3000/public。您将看到所有文件的列表！

结论

在本文中，您安装并使用了Express来构建一个Web服务器。您还使用了内置和第三方中间件函数。

继续学习，了解如何在Express中使用req对象，如何在Express中使用res对象以及如何在Express中定义路由和HTTP请求方法。