Next.JS: 如何在服务器端发出所有请求
Next.JS: How to make ALL requests server-side
我正在构建一个 Next.JS 应用程序,它将从 Python API 和 Postgres 数据库中获取数据。
通常这很简单,除了要求我需要从服务器端发送所有请求,而不是用户的客户端。
我一直在研究 getInitialProps
,但我不确定它是否是我需要的完整解决方案,因为 README
:
中的这一行
For the initial page load, getInitialProps
will execute on the server only. getInitialProps
will only be executed on the client when navigating to a different route via the Link component or using the routing APIs.
似乎getInitialProps
是为初始页面加载而设计的,而不是为后续的服务器端数据获取而设计的。
如何设计我的 Next.JS 应用程序,使所有请求都来自服务器端?
备注:
- 没关系,每个请求基本上都会导致初始页面加载。
- 用户客户端可以与 Node (Next.JS) 服务器对话,因为它是公开的。我目前正在尝试将 Next.JS 包装在 express server.
中
如有任何帮助请提前联系
我通过在 Express 中包装 Next.JS 找到了解决方案!
我已经推送了一个简单的示例项目到GitHubhere
该存储库有一个很好的自述文件以及代码中的注释,详细说明了正在发生的事情。
简要说明:
- 将 Next.JS 包装在快速服务器中。通过调用
nextApp.render(...)
显式呈现页面,这在标准 Next.JS 应用程序中隐式发生。参见 server.js
- 使用快速路由。在使用
nextApp.render(...)
呈现页面之前发出服务器端请求。参见 server.js。
- 使用标准锚标记确保页面请求到达快速服务器。参见 index.js
nextApp.render
在 getInitialProps
的上下文 (ctx
) 参数中提供传递给页面的值。您可以通过在 getInitialProps
中返回这些值,使它们在页面 this.props
中可用。参见 stars.js
欢迎提出建议和改进!
这通常是个坏主意。
SPA 的全部意义在于防止加载整页。
您可以使用 getInitialProps
在初始页面请求和后续导航中获取内容,因为它会在每个页面上调用。
接下来鼓励您使用 API 与服务器对话
我认为这只需 getServerSideProps()
Official Docs 即可完成。它就像它所说的一样简单:“如果你从一个页面导出一个名为 getServerSideProps 的异步函数,Next.js 将在 each 请求上使用由getServerSideProps
我正在构建一个 Next.JS 应用程序,它将从 Python API 和 Postgres 数据库中获取数据。
通常这很简单,除了要求我需要从服务器端发送所有请求,而不是用户的客户端。
我一直在研究 getInitialProps
,但我不确定它是否是我需要的完整解决方案,因为 README
:
For the initial page load,
getInitialProps
will execute on the server only.getInitialProps
will only be executed on the client when navigating to a different route via the Link component or using the routing APIs.
似乎getInitialProps
是为初始页面加载而设计的,而不是为后续的服务器端数据获取而设计的。
如何设计我的 Next.JS 应用程序,使所有请求都来自服务器端?
备注:
- 没关系,每个请求基本上都会导致初始页面加载。
- 用户客户端可以与 Node (Next.JS) 服务器对话,因为它是公开的。我目前正在尝试将 Next.JS 包装在 express server. 中
如有任何帮助请提前联系
我通过在 Express 中包装 Next.JS 找到了解决方案!
我已经推送了一个简单的示例项目到GitHubhere
该存储库有一个很好的自述文件以及代码中的注释,详细说明了正在发生的事情。
简要说明:
- 将 Next.JS 包装在快速服务器中。通过调用
nextApp.render(...)
显式呈现页面,这在标准 Next.JS 应用程序中隐式发生。参见 server.js - 使用快速路由。在使用
nextApp.render(...)
呈现页面之前发出服务器端请求。参见 server.js。 - 使用标准锚标记确保页面请求到达快速服务器。参见 index.js
nextApp.render
在getInitialProps
的上下文 (ctx
) 参数中提供传递给页面的值。您可以通过在getInitialProps
中返回这些值,使它们在页面this.props
中可用。参见 stars.js
欢迎提出建议和改进!
这通常是个坏主意。
SPA 的全部意义在于防止加载整页。
您可以使用 getInitialProps
在初始页面请求和后续导航中获取内容,因为它会在每个页面上调用。
接下来鼓励您使用 API 与服务器对话
我认为这只需 getServerSideProps()
Official Docs 即可完成。它就像它所说的一样简单:“如果你从一个页面导出一个名为 getServerSideProps 的异步函数,Next.js 将在 each 请求上使用由getServerSideProps