问题标签 [server-side-rendering]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
628 浏览

javascript - 服务器端渲染 HTML 模板

我部署了一个 Angular 1 Web 应用程序,其中所有视图(html)都在客户端。我在服务器端公开了 REST API,我的 Angular 服务使用这些 API 来获取 JSON 响应,然后将其填充到我的视图中并将其呈现给 UI。现在我计划在服务器端渲染视图。

我无法在客户端更改我的技术堆栈,但我在服务器端确实有堆栈的自由。

博客建议使用 REACT 进行服务器端渲染,但我怀疑我们是否可以在 REACT 中进行服务器端渲染,在 Angular 中使用客户端。我还有什么其他选择?

请提出任何可能的替代方案。提前致谢

0 投票
1 回答
359 浏览

javascript - NodeJs在服务器端渲染HTML模板+逻辑

您好我正在我现有的基于 Angular 1 的 UI 项目中开发一个小部件模块。这个小部件应该包含实时信息。

根据我的设计,我想在发出第一个请求时从节点服务器(可能使用 express js)向客户端发送 html 视图。但由于数据需要实时,我无法每分钟发送完整的 html(每次都会重复模板传输)。

那么我是否有可能将模板与一组 java-script 函数一起发送给客户端,以便当客户端想要刷新数据时,他只会调用发送的 javascript 函数,并且在内部我的 javascript 函数将进行休息调用,从服务器获取 json 响应并再次重新填充最初发送的 html。

这样,我计划使用服务器提供的逻辑在服务器端进行初始渲染,然后在客户端进行后续渲染。在这里,客户端将不知道它正在渲染哪个小部件以及它具有什么功能。所有这些都将由服务器发送的 js 控制。

请让我知道如何实现这一点,因为我发现 ejs 没有达到这个目的。使用 ejs,我只需要将所有逻辑都放在服务器端。而我计划在运行时将逻辑从服务器传输到客户端。

此外,如果我的设计有一些严重的问题,请提出一些其他的替代方案。谢谢

0 投票
0 回答
419 浏览

reactjs - react 应用程序中的用户身份验证使用服务器端渲染而不使用通量

有人建议我如何在使用服务器端渲染的简单反应应用程序中实现用户身份验证。我尝试使用本地存储来保存和检索值。并使用条件,例如 { If Auth.loggedIn() ? "Hello" : "Hi"}在代码中的某处我得到了错误。

“未捕获的不变违规:您尝试使用服务器渲染将组件渲染到文档,但校验和无效。这通常意味着您渲染了......”

我调试并发现了 localstorage 的问题,该组件在服务器端和客户端都呈现,在客户端它获取值 Auth.loggedIn() true 并且服务器端为 false 所以组件不匹配这就是导致错误的原因。

我谷歌但找不到任何好的解决方案来修复错误。

有没有人建议如何解决这个问题? 在此处输入图像描述

0 投票
1 回答
1365 浏览

javascript - 反应服务器端渲染是否等待异步调用完成?

使用 react 服务器端渲染,渲染的 HTML 是否仅在状态完全加载后才发送给客户端?

例如,如果用户请求具有多个异步 API 调用的页面,那么客户端是否必须等待这些 API 调用完成才能收到任何打包的 HTML?

如果这是正确的,如果用户请求的页面运行缓慢的 API 调用,用户是否会一直看着一个空的浏览器窗口?即,服务器在向客户端发送响应之前正在等待 API 调用完成。

我已经阅读了http://redux.js.org/docs/recipes/ServerRendering.html上的文档,但我不确定我是否正确解释了它。有人可以为我澄清一下吗?

0 投票
0 回答
968 浏览

reactjs - 使用服务器端渲染在反应应用程序中加载动态元标记值的问题

我有反应应用程序使用服务器端渲染。我使用react-helmet来显示动态元标记。一切都是完美的设置。动态元标记也正确显示给浏览器,但在服务器端它采用未定义的值。有没有人告诉我它的解决方案该怎么做。

例如 :

当我查看源代码时,它不会在元标记中显示任何内容,但是当我检查浏览器元素时,它会显示元标记值。经过一段时间的调试,我发现了问题,该组件同时呈现服务器端和客户端,因此在服务器端它仅呈现具有初始状态的组件,这就是为什么不显示该值的原因。

请任何人建议该怎么做?

0 投票
1 回答
721 浏览

javascript - Express 无法正确渲染 Nunjucks

我不确定这是 express 的问题,还是我对 nunjucks 做错了什么。我想创建一个模板层次结构,其中模板包含所有公共部分,特定页面扩展模板。由于某种原因,body 字段是块状的。如果我将扩展指令更改为包含在 template.nunj 中,一切正常,但我无法扩展标题。我还尝试在 template.nunj 和 index.nunj 中显式声明标题块并调用 super() 但由于某种原因,标题或正文为空白。

快速设置:

布局.nunj:

索引.nunj

header.nunj

0 投票
1 回答
83 浏览

reactjs - 进行服务器端渲染时出错

我进行了服务器端渲染,当我打开网络查看控制台时,我收到了 2 条错误消息。

第一条错误消息:

在我的 webpack.config.js 中,我确保我使用了这个插件。

第二条错误信息:

0 投票
1 回答
494 浏览

angularjs - 带有预渲染的 Angular(.htaccess 设置)

我正在尝试使用 Prerender 服务为爬虫的服务器端渲染设置 Angular 1.5 应用程序。

内页一切正常,但主页的渲染存在问题 - 爬虫看到 404 页面而不是主页。

我想我的 .htaccess 中的其他一些规则存在问题 - 除了 Prerender 的规则,我对所有页面都使用了另外两个规则:

  • 将不带斜杠的网址重写到带有斜杠的网址上
  • 在不带 www 的 url 上重写带 www 的 url

任何提示将不胜感激!

这是我的 Apache 服务器的 .htaccess 文件

0 投票
3 回答
3635 浏览

javascript - 使用 PhantomJS 渲染 React.js 客户端 webapp

一位朋友让我捕获一个使用 React.js 构建的客户端渲染网站,最好使用 PhantomJS。我正在使用一个简单的渲染脚本,如下所示:

网址是http://azertyjobs.tk

我一直收到错误

好的,所以我发现 PhantomJS 本身并不支持 ES6 Promises,所以我尝试了各种额外的包,如以下https://www.npmjs.com/package/es6-promise并启动了变量:

然而,这仍然会产生相同的错误,尽管 Promise 现在是一个函数。网页的输出也还是空的(显然..)

现在我很老派了,所以整个客户端渲染的东西有点超出我(在各个方面),但也许有人有解决方案。我也尝试过使用等待脚本,但这绝对没有带来任何好处。我会完全错了吗?这甚至可能吗?

非常感激!

路德维希

0 投票
0 回答
567 浏览

reactjs - Elixir- phoenix 服务器端渲染 react 使用 std_json_io 和 react-stdio

我按照https://medium.com/@chvanikoff/phoenix-react-love-story-reph-1-c68512cfe18的教程开发了一个应用程序,但版本不同。

应用程序在本地运行时成功运行。Bur 在创建 mix release( MIX_ENV=prod mix release --env=prod --verbose) 并运行时rel/utopia/bin/utopia console(otp 应用程序名称为 :utopia),我遇到了错误

笨蛋惊慌失措,因此瓷器。有人请提供解决方案。

相关问题:https ://github.com/alco/porcelain/issues/13

编辑:我的 page_controller.ex