我必须在 Next.js 项目中使用 express 吗？

Posted 2023-03-06

【中文标题】我必须在 Next.js 项目中使用 express 吗？

【英文标题】：Do I have to use express in Next.js project?

【发布时间】：2020-03-03 15:45:57

【问题描述】：

我正在通过Next.js 创建一个网站。 Next.js 提供s-s-r 和dynamic routing。

我必须使用express吗？ 如果是这样，我为什么要使用它？ express 的哪些功能有用，而Next.js 没有提供？

我认为next build 和next start 显示的页面与我预期的一样。

【参考方案1】：

不需要使用 express，Next JS 已经有自己的内置服务器。然而，由于 express 很受欢迎，开发人员更容易与数据库通信或处理其他后端工作。

【讨论】：

是不是 Next use express under the hood?

它在底层使用普通 HTTP。但是使用像connect 这样的包很容易获得快速功能。 Express 使用依赖connect 包。大多数路由器都遵循 API npmjs.com/package/next-connect 或 npmjs.com/package/connect 之类的连接

@cacoder 来自他们的 package.json，看起来 NextJS 在后台使用 Express...

感谢@magne 的更新——我想当时他们提供了一个普通的 JS 服务器——听到 express 进来真是太棒了！

@cacoder 我深入研究了一下。他们似乎仍在使用自己的服务器，来自code 和docs。好像Express is included 在他们的package.json 中用于自定义服务器设置（和示例），又名。静态服务器设置。

【参考方案2】：

Next.js 和 Express.js 都是服务器端渲染解决方案 (s-s-r)。但是，您可以将 Next.js 与 Express.js 与自定义服务器 api 集成，如文档中所述：

大多数情况下，默认 Next.js 服务器就足够了，但有时您需要运行自己的服务器以集成到现有应用程序中。 Next.js 提供了一个custom server api。

const express = require("express");
const next = require("next");

const port = 3000;
const dev = process.env.NODE_ENV !== "production";
const app = next( dev );
const handle = app.getRequestHandler();

app.prepare().then(() => 
  const server = express();

  server.get("/test", (req, res) => 
    return app.render(req, res, "/test");
  );
  
  server.get("*", (req, res) => 
    return handle(req, res);
  );

  server.listen(port, (err) => 
    if (err) throw err;
    console.log(`Ready on http://localhost:$port`);
  );
);

在示例中，它展示了如何使用get Express 方法来处理 Next.js 应用程序中的路由。当用户指向http://localhost:3000/api/test 并传递req 和res 对象进行渲染时，上面的代码将在/api/test 处渲染React 组件。

【讨论】：

澄清：NextJS 使用 s-s-r（在服务器上渲染 React SPA，然后在客户端再次连接它，也就是水合它）。而 Express 是一个低级服务器，通常用于提供简单的 JSON API 或用于经典服务器渲染（模板）。区别有点模糊，因为您可以将 Express 与 NextJS 一起使用，尽管您不必这样做，因为 NextJS 有自己的低级服务器。

【参考方案3】：

答案：

开箱即用nextJS不需要使用express；绝大多数人没有。

长答案：

如果您不在 Vercel 的平台上托管，例如自托管（AWS、Digital Ocean、Azure 等），您可以选择define a custom nextjs server 并交换底层服务器实现/框架（使用 express、fastify、vanilla node 等。）。

什么时候自定义服务器是个好主意？

当您不在 vercel 上托管时 当您有自定义要求和自定义现有基础架构时

场景： 想象一下，一家大型公司拥有许多他们多年来构建的定制基础设施（日志记录、AB 测试、定制 linter 等）。他们现在想利用一些 NextJS 抽象，例如：

不同的 s-s-r 渲染策略 现代/灵活的构建系统 您需要从头开始实施、维护、测试的所有其他内容...

我们称这家公司为 XCompany。 XCompany 使用 ExpressJS（无论哪个节点服务器/框架）作为他们的 Web 服务器。他们希望继续使用 ExpressJS，因为他们已经投入了大量时间、资源来构建自定义基础架构和与之合作的工具，例如 AB 测试集成、日志记录中间件等。

自定义服务器将允许 XCompany 继续使用 Express，而无需完全重新编写更改，并且仍然受益于 NextJS 提供的 s-s-r、构建系统等内容、良好的约定和护栏等。 在回复的最后，我链接到 Lyft 的工程博客文章，内容是他们迁移到将 NextJS 与他们自己的基础设施一起使用

当您自行托管服务器并将其部署到您的基础架构时，您将获得一个长时间运行的节点服务器，这与在 vercel 上托管不同，后者的服务器是无服务器功能。

背景/历史

NextJS 底层使用普通的 HTTP 服务器。如果您想获得类似的 express 功能，例如设置/组织路线的方式，您可以使用类似 next-connect 的包。

Express 使用直接依赖connect 包。大多数 nodejs 服务器都遵循 connect 之类的 API，用于路由和设置处理程序。

对于来自 NodeJS 世界（python/flask）之外的人来说，组织服务器路由的连接方式有点像哲学上的WASGI - Web Server Gateway Interface。

使用自定义 NextJS 服务器的缺点/挑战？

初始投资学习自定义 nextJS 服务器模式

。绝大多数人不会走这条路

您无法将自定义服务器部署到 vercel

，但如果您走这条路，您可能不会走

如果您不在 vercel 上托管，您将无法获得无服务器功能

。如果您没有无服务器用例，这可能不是缺点或缺点。 例如，如果您的 Web 服务器将使用需要持续长时间运行的连接的 websockets/WebtRTC 在客户端和服务器之间比无服务器功能不是最好的 在这里选择；有解决方法，但我仍然认为它不是 最佳用例。请注意，您仍然可以通过其他提供商（AWS、Azure 等）将无服务器功能添加到您的自定义服务器

前进 大多数 js 运行时都集中在公开和使用 Request 和 Response 对象 API 并将它们公开给消费者。

注意，这里有很多东西可以讨论。请留下后续问题，我将尝试相应地更新此答案

资源

how to deploy a nextjs custom server to another provider (not vercel) fastify-nextjs 提供了如何使用 fastify 创建自定义 nextJS 服务器的示例。 Changing Lanes: How Lyft is Migrating 100+ Frontend Microservices to Next.js NextJS docs for Custom Server npmjs - connect npmjs - next-connect ExpressJS 如何在后台工作 Video: From Scratch Express Routing Express6 open source modern implementation of expressJS for educational purposes