问题标签 [server-rendering]

你好 Stackoverflow 社区

如果我的解释不够清楚，请提前道歉

当用户直接输入 url 时。服务器发出请求，获取相应的数据并呈现到屏幕上。这完美地工作

当用户点击一个链接时，页面应该切换和渲染新组件，并通过 componentDidMount 从服务器获取相应的数据并保存到状态，但由于某种原因数据没有出现在页面上

当我运行下面的代码时，console.log('2') 出现在 console.log('1') 之前，这意味着状态在填充获取的数据之前首先呈现为未定义

它看起来像一个异步问题，但我不知道如何解决它，这不应该是这种情况，因为它适用于普通的客户端应用程序

但是即使事件的顺序被扭曲了，当状态改变没有发生时，应用程序也应该重新渲染。

新闻.js

新闻列表.js

在此先感谢您的帮助

如题。由于它使用了许多只有浏览器才有的因素，所以我想不出一种解决方案。谁能帮我？

我正在使用 headless-gl 在 Node.js 上运行 webGL，在服务器上动态创建图像。创建后，图像将存储在数据库（MongoDB）中，然后用户再次通过 API 访问图像。

下面是生成图像的部分：

然后将像素转换为 base64（因为这似乎是图像在客户端 HTML 中加载的推荐方式）。

但是，此缓冲区生成的字符串无法解码以生成图像。可能像素不是“二进制”类型？或者我应该将像素字符串保存在数据库中并尝试在客户端中逐个像素地重绘画布中的像素（我认为这不是最好的方法）？

我在渲染服务器端时遇到了麻烦。我总是得到^

ReferenceError：文档未定义

var root = document.getElementById('root');

我知道该节点不理解浏览器文档对象发生了什么。但我似乎无法修复它。我在 webpack 或服务器或 app.js 中做错了什么。

这是我的代码

服务器.js

webpack.config.node.js

最后是我的 app.js

服务器渲染的框架/库（例如用于 React 的Nextjs、用于 Vue 的 Nuxt）和非JS REST API 后端（即 Java、Django、Go 等）是否相互排斥，或者它们可以一起使用吗？

具体来说，我正在使用 Go 在后端构建一个 REST API，我想知道我是否必须放弃它来让页面服务器呈现。

在我的数据库中，我有一组动物，我想将它们渲染成一个漂亮的小列表。为了改善用户体验，我想在服务器上渲染它（使用新包），然后使用( )server-render订阅任何更改。react-meteor-datawithTracker

现在，除了一件事之外，这是可行的。服务器按预期呈现内容（包括数据），然后将其发送到客户端。问题出在客户端。

页面加载后，meteor 建立数据连接，然后呈现页面。第一次渲染发生在数据连接返回任何数据之前，因此它渲染了一个空的动物列表（覆盖服务器上渲染的列表并导致警告）。然后，一旦数据到达，列表就会完全（重新）呈现。

当列表闪烁然后返回时，这会导致非常糟糕的用户体验。我想推迟客户端渲染，直到数据可用。这可能吗？

我的代码非常简单，看起来像这样：

列表组件：

服务器：

客户：

数据库：

会发生什么（Animals.jsx 中的console.log）：

1. 在服务器上渲染 [动物数据]
2. 在数据到达之前在客户端呈现。这将删除服务器上呈现的列表 []
3. 数据到达时在客户端呈现 [动物数据]

我正在尝试在服务器上呈现反应应用程序，但似乎 renderToString 函数不会仅呈现路由 html 的页眉和页脚。通过查看页面代码，您只能看到服务器从 App.js 返回的页眉和页脚。但是路线中的代码不在页面上。

我正在使用 React-Router v4。我的代码如下所示：

服务器.js

渲染.js

应用程序.js

roures.js

客户端.js

我有我的 Angular 4+ webapp，它在不同的路线上有不同的标题。所有组件都通过 Angular 代码加载，因此，一切都是 javascript，除了根组件之外没有太多 HTML。因此，谷歌无法抓取任何链接。搜索引擎优化受到了打击。我想知道如果我添加页眉和页脚 HTML 代码并将其默认标记为隐藏，谷歌和其他社交网站是否能够抓取我的页面。

我知道我们可以使用 Angular Universal 并使用服务器端渲染，但是对于临时修复，上述解决方案是否可行？此外，除了从服务器到客户端的额外字节传输之外，它还有什么缺点吗？

这个问题不是重复的，因为它指的是 angular 2+ 版本。大多数答案都是 angularjs。

我已经搜索了几个小时，但没有找到任何接近我的用例的东西。

• 我有一个用 JAVA 制作的经典/多页/服务器渲染的电子商务网站
• 我有一个页面，服务器在其中呈现带有分页的产品列表
• 今天，我使用jQuery做分页，给用户更好的加载体验
• 在我的服务器上，如果请求是 AJAX 发送一个 json 响应，否则我呈现一个普通的 html 视图
• 使用 jQuery 和 vanilla 真的很简单，使用 Vue 似乎不起作用，因为 Vue 的 v-for 和其他模板绑定直接替换了服务器呈现的模板……</li>
• 服务器会渲染这个：

• 我希望能够使用 Vue 做这样的事情：

关于如何做到这一点的任何想法？这是我的尝试： https ://jsfiddle.net/7270zft3/2/ ：问题，它不会删除旧的dom

PS：在有人用 Vue 谈论 SSR 之前，你只是在做一个 SPA，这就是为什么我不能：

• 这个电商网站不能用单页App完全改造，要花太多时间和金钱才能给我们带来好处
• 这个电子商务需要 SEO 来继续推动流量，就像任何电子商务 btw
• 如果 Vue 真的可以像 jQuery 一样使用（这就是我们押注 Vue 的原因），我们应该能够做到这一点而无需完全重写
• 如果我们有时间重写 SPA，我们不能使用 SSR，因为我们的后端是用 JAVA 制作的，而 SSR 似乎只能用于 node 和带有 v8js 模块的 PHP

我目前正在设计一个新的 Web 应用程序，我想将 next.js 用于 SSR（使用 React、Redux、SCSS (CSS-Modules)）。

1) 有没有人有在高负载项目上使用 next.js 的经验？
2) after.js、razzle、next.js 的任何基准测试？
3) React SSR 框架与 Pug、Nunjucks、PHP？

PS如果已经提出此类问题，我深表歉意。