在前端开发中，Next.js 和 Express 都是非常优秀的工具。Next.js 可以让你快速开发 React 应用程序并支持服务器渲染，而 Express 是一个流行的 Node.js Web 框架，让你可以轻松构建 Web API。
有时我们需要在 Next.js 中使用 Express，例如在我们需要实现一些自定义的 API 时。本文将介绍如何在 Next.js 中集成 Express，并提供详细的步骤和示例代码。
第一步：安装 Express
首先需要安装 Express。你可以使用 npm 或者 yarn 进行安装。
npm install express --save
或者
yarn add express
第二步：创建 Express 的服务
First, you need to create an instance of the Express application:
// server.js
const express = require('express');
const app = express();
app.listen(3000, () => {
console.log('Express server is running on port 3000');
});这会创建一个 Express 的实例，并将其运行在 3000 端口上。
第三步：将 Next.js 请求路由到 Express
在这一步中，我们要配置 Next.js 以便可以将请求路由到 Express。
首先，我们需要创建一个自定义的服务器。在 Next.js 中，可以通过在根目录下创建 server.js 文件来创建自定义的服务器。
-- -------------------- ---- -------
-- ---------
----- ------- - -------------------
----- ---- - ----------------
----- --- - -------------------- --- -------------
----- --- - ------ --- ---
----- ------ - ------------------------
-------------
-------- -- -
----- ------ - ----------
------------------------ ----- ---- -- -
---------- ------ -- ---
---
--------------- ----- ---- -- -
------ ----------- -----
---
------------------- ----- -- -
-- ----- ----- ----
-------------- ----- -- ------------------------
---
--
----------- -- -
------------------------
----------------
---在这个例子中，我们创建了一个 Express 服务器，并添加了一个 /api/users 的路由，用于演示在 Next.js 中使用 Express 实现 Web API。
在最后的行，我们使用 server.listen 来启动服务器并监听 3000 端口。除此之外，我们还使用了一个错误处理，帮助我们处理潜在的错误。
第四步：运行服务器
最后一步是运行 Next.js 的服务器，并向任何请求路由到 Express 服务器。
npm run dev
或者
yarn dev
这将启动 Next.js 的开发服务器。现在，你可以在浏览器中访问 http://localhost:3000/api/users，可以看到已经成功地使用 Express 构建 Web API。
结论
在本文中，我们详细介绍了如何在 Next.js 中使用 Express，从安装 Express，到创建一个 Express 服务器，再到将 Next.js 请求路由到 Express，最后是运行服务器。这个过程可以让我们更好地了解如何使用这两个工具，并为我们在实践中集成它们提供了指导意义。
示例代码：https://github.com/jessicaccp/nextjs-express-demo
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674bd9abd657e1f70dc1668b