如何在 Node.js 中设置 Express.js 服务器

2025-06-09

如何在 Node.js 中设置 Express.js 服务器

本教程旨在向您展示如何使用 Express 框架和 Node.js 从零开始搭建并运行一个简单的服务器。本教程深入介绍了无需编写前端即可测试服务器的不同方法。

理解条款

很容易就复制粘贴一些代码示例来运行程序,而实际上根本不了解代码的具体功能。
为了避免这种情况,我将简要定义一些重要的术语和概念,希望能帮助大家填补一些概念上的空白。

  • REST 或 RESTful 架构:表述性状态转移或 REST 是一种设计代码库的标准化方式,以便于客户端和服务器之间的通信。
  • 客户端:向服务器发送请求(例如 GET、POST 和 DELETE)。客户端经常与应用程序的“前端”混淆,但两者之间有明显的区别。任何发送请求的事物都是客户端,包括服务器、Bash 脚本和网站。
  • 服务器:响应来自客户端的请求。响应可以是多种形式,但最常见的 API 响应是 JSON 文件。
  • JSON:JavaScript 对象表示法是一种使用 JavaScript 语法格式化数据的标准方式。
  • API(应用程序编程接口):允许客户端与服务器交互的代码。

当您学习本教程时,您将看到这些术语的更多实际示例。

要求

在本教程中,你需要一个 Unix shell 来运行 bash 命令。在 Mac 和 Linux 上,你可以使用终端运行命令,没有任何问题。在 Windows 上,你可以使用Git BashLinux for WindowsCmder或其他 Unix shell。

您还需要安装Nodenpm

要检查是否安装了 Node,请打开终端并运行:



node -v


Enter fullscreen mode Exit fullscreen mode

要检查是否安装了 npm,请打开终端并运行:



npm -v


Enter fullscreen mode Exit fullscreen mode

完成这些之后,您就可以设置项目了!

设置你的项目

首先,为您的项目创建一个文件夹并进行更改。



mkdir express-tutorial && cd $_


Enter fullscreen mode Exit fullscreen mode

这里我们使用了$_,它是上一个命令输入的别名。该mkdir命令的输入是express-tutorial,因此cd $_转换为cd express-tutorial

专业提示:我正在使用git文件夹进行版本控制,所以我git init现在也做了一个。为了简单起见,我将git不在本教程中介绍,但在实际项目中,现在是开始跟踪更改的好时机。

现在,我们要创建一个package.json文件来跟踪项目的依赖关系,以便我们稍后可以做一些很酷的事情。为此,请运行:



npm init -y


Enter fullscreen mode Exit fullscreen mode

这将创建一个package.json文件,并根据标志对所有问题回答“是” -y

如果您检查package.json文件,它应该看起来类似于此:



{
  "name": "express-tutorial",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "Kyrell Dixon",
  "license": "MIT"
}


Enter fullscreen mode Exit fullscreen mode

如果您的package.json版本不完全相同,也没关系。您可以添加您想要匹配的字段,但我会在此文件更改时指出您需要注意哪些字段。

现在我们需要做的最后一件事是添加 Express 框架。Express 是我们将用来创建实际 API 端点的 Node.js 框架,因此我们需要安装该包。为此,请使用:



npm i express


Enter fullscreen mode Exit fullscreen mode

这里npm i简称为,npm install因为您输入的字母越少,腕管的风险就越小(并且因为最好的开发人员都很懒惰)。

运行此命令将添加一些新文件:



.
├── node_modules #new
├── package-lock.json #new
└── package.json


Enter fullscreen mode Exit fullscreen mode

专家提示:为了显示它,我使用了一个名为 的命令tree链接将帮助您在 MacOS 和 Ubuntu 上安装它。

node_modules文件夹是 Express 框架代码及其所有依赖项所在的位置。如果您使用 git,请确保除非绝对必要,否则不要提交此文件夹,因为它非常庞大

专业提示:npkill如果您想要一种轻松地从计算机上未使用的项目中删除 node_modules 的方法,请检查一下。

package-lock.json文件自动生成的主要目的是跟踪项目依赖项,但它有多种用途。更多信息,请查看 npm 文档中对此文件的描述

这样,我们就完成了项目的所有初始设置。现在我们可以开始创建服务器了。

创建初始服务器

首先我们要创建一个文件来存储我们的主要服务器代码:



touch index.js


Enter fullscreen mode Exit fullscreen mode

使用index.js作为根文件是非常标准的,因为这可以向其他开发人员传达这是您的应用程序的启动位置。

但是,如果这只是一个只有您自己能看到的个人项目,您可以随意命名。文件名称其实并不重要。

从这里,您可以随意命名文件并输入以下内容:



const express = require("express");

const app = express();

app.listen(1234, () => {
  console.log("Server is listening on port: 1234");
});


Enter fullscreen mode Exit fullscreen mode

那么这里发生了什么?

第 1 行负责将您之前安装的 express 包导入到您的服务器文件中。

第 3 行调用 express 函数,该函数返回一个 express 应用程序。

第 5-7 行告诉您的应用程序监听端口 1234 上的任何传入请求。现在,您可以将端口视为类似于街道号码的 URL 的更具体地址。

要测试代码,请返回命令行并运行:



node index.js # or node your-filename.js


Enter fullscreen mode Exit fullscreen mode

如果您已经按照到目前为止的每个步骤操作,您应该会在终端中看到一条消息:



Server is listening on port: 1234


Enter fullscreen mode Exit fullscreen mode

如果没有,请尝试调试!如果收到某种类型的错误消息,请尝试自行解读,或者直接复制粘贴到 Google 中。

如果其他方法都失败了,请联系我,我或社区中的其他人将很乐意提供帮助。

一切准备就绪后,您几乎就可以创建一些 API 端点了!嗯,差不多了。首先,我们要快速重构一下端口。

快速重构PORT

作为快速重构,我们将端口移动到它自己的变量,如下所示:



const express = require("express");

const PORT = 1234;
const app = express();

app.listen(PORT, () => {
  console.log(`Server is listening on port: ${PORT}`);
});


Enter fullscreen mode Exit fullscreen mode

这样就去掉了开发者所谓的“魔法数字”。魔法数字就是一个没有标签的数字。在这种情况下,如果我们没有明确地保存到常量1234PORT,任何阅读代码的人都不知道这个数字的用途。

另一个微妙的好处是,我们现在可以重复使用 PORT 变量,这样console.log,如果我们更改 PORT,我们只需要在一个地方更改它。

像这样的简单重构可以帮助您获得易于理解和使用的干净代码。

解决了这个问题后,我们就可以开始创建 API 端点了。

创建 REST API 端点

我们将创建的第一个端点将处理 GET 请求。



const express = require("express");

const PORT = 1234;
const app = express();

app.get("/hello", (req, res) => {
  res.send("Hello world");
});

app.listen(PORT, () => {
 console.log(`Server is listening on port: ${PORT}`);
});


Enter fullscreen mode Exit fullscreen mode

让我们来分析一下。

首先,我们app.get("/hello", ...)告诉服务器我们希望能够处理对/hello端点的 GET 请求。

跟随端点的(req, res) => {...}是 ES6箭头函数,它接受两个参数reqres

第一个参数req是一个变量,用于存储来自客户端的所有信息req。服务器res响应函数都存储在该res参数中。

在这种情况下,我们使用res.send字符串进行响应"Hello world"

那么,服务器启动并运行后,该如何测试呢?我将介绍三种无需编写任何代码即可测试 API 端点的方法。

测试 API 端点的三种方法

为了测试"/hello"端点,我们要向完整的服务器 URL 发送 GET 请求localhost:1234/hello

我们正在使用它,localhost因为我们在本地运行服务器,并且:1234这是服务器正在监听的端口。

测试这一点的第一种方法是在浏览器中!

从浏览器测试 GET 端点

打开 Chrome、Firefox、Safari 或任何你习惯的浏览器。但千万用 Internet Explorer。它的缔造者微软根本不希望你用

如果出现错误,请确保使用 重新启动服务器,ctrl+c然后使用node index.js。 (稍后我将向您展示一种避免因忘记重新启动服务器而导致错误的方法。)

您的浏览器应该如下所示:

浏览器中的 Hello world 端点

为什么这样做有效?

每当您访问浏览器的地址栏时,它实际上都会向您提供的 URL 发出 GET 请求。例如,每次您访问 google.com 时,浏览器都会发出 GET 请求,Google 服务器会向您发送显示 Google 搜索栏所需的 HTML、CSS 和 JavaScript。

端点的 GET 路由"hello"目前正在发送字符串"Hello world",但我们可以让它发送几乎任何包含文本的文档 - 这实际上就是 JSON 或 HTML 文件。

浏览器非常适合快速测试我们的 GET 端点,但如果您需要测试任何其他类型的请求,例如 POST 或 DELETE,则需要完全不同的方法。下一个方法将向您展示如何使用 cURL 完全从命令行测试端点。

使用 cURL 从命令行测试任何 API 端点

有时,您希望快速测试 API 端点,而无需离开代码编辑器。如果您使用的是 Visual Studio Code,则无需打开其他应用程序即可测试 API 端点。(如果不是,您可以打开终端并继续使用此方法。)

专业提示:使用 Visual Studio Code。它是最好的。

要使用 cURL 测试端点,请转到命令行并输入:



curl localhost:1234/hello


Enter fullscreen mode Exit fullscreen mode

您应该获得"Hello world"与从浏览器获得的相同的响应。

使用 cURL,你还可以执行其他类型的请求,例如 POST、PUT 和 DELETE,修改标头,使用 Cookie,以及测试 API 所需的几乎所有其他操作。它是一款非常强大的工具,但如果你不喜欢使用命令行,学习起来可能会很枯燥。

这就是最终解决方案的用武之地。

使用 Postman 测试你的 API 端点

Postman 首页

Postman提供了一个美观的 GUI(发音为“gooey”),即图形用户界面,可以轻松地向你的端点发送请求。我个人在使用 Postman 时,经常使用 GUI,因为它让 API 测试变得非常简单。当你的 API 变得越来越复杂,并且需要测试各种各样的端点时,它就显得尤为重要。

在这种情况下,您只需传入如上图所示的 URL,然后点击“发送”。响应"Hello world会像平常一样显示,但您还可以看到随响应一起返回的标头。

Postman 标头

您可以将标头视为有关请求或响应的简单数据。在图中,您可以看到一个X-Powered-By: Express标头,它告诉您 Express 负责发送此响应。

另一个值得注意的标头是Content-Type让客户端知道如何解释响应主体的标头。之所以在这里使用这个标头,是因为它是用于响应时的text/html; charset=utf-8默认设置。Content-Typeres.send

Postman 解析了其他几个默认的响应头,使其易于查看,但在每种技术中,发送的响应头和响应主体完全相同。这表明使用不同的工具各有利弊,有时你只需尝试不同的方法来完成同一项任务就能有所收获。

现在测试已经完成,我想展示一种可选的方法来避免您在职业生涯中不可避免地会遇到的常见错误。

奖励:减少开发错误nodemon

每次对服务器进行更改后,都必须停止并重新启动服务器才能测试这些更改。忘记重新启动服务器可能会导致数小时的沮丧和疑惑,因为您以为代码无法正常工作,而实际上服务器只是尚未加载更改。

如果你还没有经历过这种困境,那你就是少数幸运儿之一。这个技巧能让你避免遇到这种麻烦。解决方案是安装一个名为 的 npm 包nodemon

有了nodemon,您无需手动重启服务器。它会在后台运行,并监视所有文件的更改。一旦检测到更改,它就会自动重启服务器,让您可以专注于编写代码。

首先您需要安装它:



npm i --save-dev nodemon


Enter fullscreen mode Exit fullscreen mode

在这里,您可以使用--save-dev或标志在文件中-D添加 nodemon devDependenciespackage.json

您的package.json文件现在应该包含类似这样的对象:



{
  "devDependencies": {
    "nodemon": "^1.19.1"
  }
}


Enter fullscreen mode Exit fullscreen mode

我们将其添加到是devDependicies因为这只是运行服务器的一种便捷方式,可以使开发更容易,并且不需要有可运行的应用程序。

要使用nodemon运行服务器,首先要向对象中添加一个"start"脚本package.json"scripts"



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


Enter fullscreen mode Exit fullscreen mode

然后您可以使用以下命令运行服务器:



npm start


Enter fullscreen mode Exit fullscreen mode

这应该创建一个如下所示的显示:

Nodemon 输出

另一种方法是进行全局安装,这样您就可以从任何nodemon项目的命令行运行它,而无需将其安装为devDependency

要执行该操作,请运行:



npm i -g nodemon


Enter fullscreen mode Exit fullscreen mode

这将在整个系统范围内安装软件包,而不仅仅是针对特定项目。这样你就可以直接nodemon index.js从命令行运行,而无需在文件中设置脚本package.json

完成

本教程介绍了 Express 服务器的初始设置、创建 GET 端点以及使用cURL、浏览器和 Postman 测试端点。

现在,您应该已经掌握了探索和测试其他类型端点所需的一切。接下来,我将为那些想要进一步学习本教程内容的同学们准备一些实践练习。

练习

  • 将代码推送到 GitHub
  • 向服务器添加 POST、PUT 和 DELETE 端点
  • 阅读 Express.js文档
  • 创建一个简单的表单并将其连接到服务器
  • 在DigitalOcean或无服务器云提供商上部署服务器

如果您有任何问题或反馈,请在Twitter上联系我

鏂囩珷鏉ユ簮锛�https://dev.to/kyrelldixon/how-to-setup-an-express-js-server-in-node-js-56hp
PREV
基本 curl 选项概述添加标头使用参数发出 POST 请求获取详细响应仅获取 HTTP 标头添加 cookie 发送数据(如通过表单发送)资源
NEXT
一个业余项目如何帮助我实现薪水翻倍 Android-Static-Security-Audit