Next.js 架构
Next.js Architecture
我正在寻找一些 Next.js 架构建议
我正在将具有自定义 SSR 设置的非常大的 Express NodeJS 应用程序迁移到 Next.js 设置。
对于当前的 NodeJS 站点，我有：
- 一堆路由（连接控制器/apis，做花哨的重定向等）
- 拥有大量中间件
- 一堆快速控制器中的大量逻辑（这些控制器执行 API 调用、转换数据、验证和一些 React 组件的 SSR 以形成应用程序）
- 大多数时候 NodeJS 服务器调用其他微服务 APIs（在同一个 VPC 上）来获取这些控制器中的数据（例如：search api、auth api、位置 api 等——它们都是独立的 REST api 服务器）注意： 当它从这些 API 中获取时，它是在内部 api 仅地址
- 当路由发生变化时，React 网站本身调用同一个 NodeJS 服务器通过客户端 JS 获取数据
eg: 前端 URL 将是：www.mywebsite.com.au
从前端完成的任何 api 调用都是通过路由完成的：www.mywebsite.com.au/api/*
根据我目前阅读的所有文档，我认为最佳设置是：
- 为了保留我现有的路由/中间件（我有很多）的快速设置，这包括
/api/* 个
- 将控制器获取逻辑迁移到 publically 可访问的 express apis
/api/*（我已经有了但需要清理）
- 对于现有的快速控制器路由，将它们路由到 Next.js 并使用
nextApp.render 到特定的下一页
- 在 Next.js 页中使用
getInitialProps 从我在 2. 中提到的那些 api 中获取数据
- 还将 express 控制器中的旧道具转换逻辑添加到
getInitialProps
这样服务器和客户端就可以共享 getInitialProps 中的相同逻辑 - 这将使架构变得干净，并使我能够顺利过渡到使用 Link。
我遇到的问题是第 4 步。
这意味着现在在页面请求的 SSR 上，它需要调用 getInitialProps 上的 public api (www.mywebsite.com.au/api/*) 来获取其数据。
对我来说，执行此操作似乎是一种性能开销，因为它需要网络跳转到 public 域 mywebsite.com.au 以获取它本可以在同一请求上本地获取的数据（通过调用 localhost:3000/api/* 例如）
关于如何避免网络跳到服务器渲染之外的任何建议？
我可以检测它是否是服务器呈现然后使用内部 URL（例如：在对同一 Web 服务器的请求上使用 localhost:3000/api/*）或者在使用 Next.js 时这不是最佳实践吗？
服务器需要调用自己来获取数据，获取数据所涉及的很多开销都与延迟有关（即客户端和最近的数据中心之间），当它的（数据中心）时，这将不再是一个问题-> 数据中心）。
如果性能仍然是个问题，您的下一个最佳选择是进行 SSR 缓存，您可以在快速 google 搜索中找到很多不同的方法，但这取决于您的 hosting/setup.
我将 listing-page.jsx 和 api/listing 路由的处理程序视为相同。您可能需要编写 2 个小函数来提取传递给请求的参数并将其传递给您的服务模块函数，例如 ListingService.getSingleListisng(id)
我正在寻找一些 Next.js 架构建议
我正在将具有自定义 SSR 设置的非常大的 Express NodeJS 应用程序迁移到 Next.js 设置。
对于当前的 NodeJS 站点，我有：
- 一堆路由（连接控制器/apis，做花哨的重定向等）
- 拥有大量中间件
- 一堆快速控制器中的大量逻辑（这些控制器执行 API 调用、转换数据、验证和一些 React 组件的 SSR 以形成应用程序）
- 大多数时候 NodeJS 服务器调用其他微服务 APIs（在同一个 VPC 上）来获取这些控制器中的数据（例如：search api、auth api、位置 api 等——它们都是独立的 REST api 服务器）注意： 当它从这些 API 中获取时，它是在内部 api 仅地址
- 当路由发生变化时，React 网站本身调用同一个 NodeJS 服务器通过客户端 JS 获取数据
eg:前端 URL 将是：www.mywebsite.com.au从前端完成的任何 api 调用都是通过路由完成的：www.mywebsite.com.au/api/*
根据我目前阅读的所有文档，我认为最佳设置是：
- 为了保留我现有的路由/中间件（我有很多）的快速设置，这包括
/api/*个 - 将控制器获取逻辑迁移到 publically 可访问的 express apis
/api/*（我已经有了但需要清理） - 对于现有的快速控制器路由，将它们路由到 Next.js 并使用
nextApp.render到特定的下一页 - 在 Next.js 页中使用
getInitialProps从我在 2. 中提到的那些 api 中获取数据
- 还将 express 控制器中的旧道具转换逻辑添加到
getInitialProps
这样服务器和客户端就可以共享 getInitialProps 中的相同逻辑 - 这将使架构变得干净，并使我能够顺利过渡到使用 Link。
我遇到的问题是第 4 步。
这意味着现在在页面请求的 SSR 上，它需要调用 getInitialProps 上的 public api (www.mywebsite.com.au/api/*) 来获取其数据。
对我来说，执行此操作似乎是一种性能开销，因为它需要网络跳转到 public 域 mywebsite.com.au 以获取它本可以在同一请求上本地获取的数据（通过调用 localhost:3000/api/* 例如）
关于如何避免网络跳到服务器渲染之外的任何建议？
我可以检测它是否是服务器呈现然后使用内部 URL（例如：在对同一 Web 服务器的请求上使用 localhost:3000/api/*）或者在使用 Next.js 时这不是最佳实践吗？
服务器需要调用自己来获取数据，获取数据所涉及的很多开销都与延迟有关（即客户端和最近的数据中心之间），当它的（数据中心）时，这将不再是一个问题-> 数据中心）。
如果性能仍然是个问题，您的下一个最佳选择是进行 SSR 缓存，您可以在快速 google 搜索中找到很多不同的方法，但这取决于您的 hosting/setup.
我将 listing-page.jsx 和 api/listing 路由的处理程序视为相同。您可能需要编写 2 个小函数来提取传递给请求的参数并将其传递给您的服务模块函数，例如 ListingService.getSingleListisng(id)