问题描述
我非常习惯SSR的意思，即页面完全刷新并从服务器接收了完整的HTML，然后根据后端堆栈使用razor/pub/other呈现页面.因此，每次用户单击导航链接时，它只会向服务器发送一个请求，整个页面将刷新，并接收新的HTML.我了解这就是传统的SSR.
I am very used to the approach where SSR meant that the page got a full refresh and received a full HTML from the server, where it gets rendered with razor/pub/other depending on the backend stack. So every time the user would click on the navigation links, it would just send a request to the server and the whole page would refresh, receiving a new HTML. That is the traditional SSR which I understand.
但是，使用SPA时，例如，我们有react或angular，在开始时收到几乎空的HTML，然后收到JS，以便整个应用程序在客户端初始化.然后，我们可以使用一些REST API来获取json数据并在前端(客户端路由和渲染)上渲染视图，而无需刷新页面.我们甚至不需要任何服务器.
With SPA however, we have for example react or angular, where we receive almost empty HTML on the beginning and then the JS so that the whole app gets initialized on the client side. We can then have some REST API to get json data and render views on the frontend (client side routing and rendering) without any page refresh. We don't even need any server really.
现在，我有一个理解上的问题是SSR(例如next.js)如何与react一起工作.
Now, what I have a problem understanding is how SSR (such as next.js) works with react.
从我正在阅读的内容中，第一个请求返回完整的HTML + CSS(这有助于SEO等-我明白了)，但是稍后会发生什么??整个react应用程序是否会在浏览器中初始化，然后像正常的SPA一样正常运行(这意味着我们从现在开始具有客户端路由和渲染功能，而无需向该服务器发出请求)?换句话说，在最初的请求之后，next.js还会发出任何服务器请求吗?还是从现在起它像具有CRA的典型SPA一样?
From what I am reading, the first request returns full HTML+CSS (which helps with SEO etc - I get that), but what happens later? What happens after that first/initial request? Does the whole react app initialize in the browser and then it just behaves EXACTLY as if it was a normal SPA (meaning we have client side routing and rendering from now on, without any need to make requests to that server)? In other words, does next.js still make any server requests after the initial one, or does it act like a typical SPA with CRA from now on?
我花了很多时间阅读，但是所有文章都主要关注初始请求和SEO以及到第一个字节，绘制等的时间，我只是试图理解为什么它称为SSR，因为它看起来与传统的SSR不同我一开始就描述了SSR.
I spent lots of time reading but all the articles mainly focus on the initial request and SEO and time to first byte, paint etc. and I am simply trying to understand why its called SSR since it seems to work different than the traditional SSR which I described on the beginning.
推荐答案
在最初的请求之后，next.js仍然会发出任何服务器请求吗?或者从现在开始，它是否像具有CRA的典型SPA一样?
您说对了.服务器首先处理第一个(初始)请求，然后由前端处理路由(至少在Next.js情况下).
You got it right. The first (initial) request is handled by the server and after that the frontend handles the routing (at least in the case of Next.js).
如果要查看示例，则使用Next.js构建 OpenCollective .尝试使用它，然后在DevTools中查看网络"选项卡.
If you want to see an example OpenCollective is built with Next.js. Try playing around with it and see the Network tab in the DevTools.
我只是想了解为什么将其称为SSR，因为它的工作方式似乎与我一开始所描述的传统SSR不同.
之所以称为SSR，是因为该应用已在服务器上有效呈现.前端路由在初始渲染之后会引起注意，这一事实并不能消除服务器已将应用程序渲染为与用户计算机相对的事实.
It is called SSR because the app is effectively being rendered on the server. The fact that frontend routing takes care after the initial render doesn't remove the fact that the server did the work of rendering the app as oppose to the user machine.
这篇关于使用next.js与传统SSR进行服务器端渲染的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！