问题标签 [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 投票
3 回答
13563 浏览

laravel - 如何使用 Laravel + React.js + Redux 进行服务器端渲染?

我们正在设置一个在后端使用 Laravel 并在前端使用 React.JS + Redux 的应用程序。因此寻找服务器端渲染的解决方案(用于 SEO)。

找到了这个解决方案:https ://github.com/tz5514/Laravel-Redux-Isomorphic但它似乎在后端使用 express.js 进行渲染。

所以我正在寻找任何更好的服务器端渲染解决方案。

0 投票
0 回答
77 浏览

reactjs - 脆弱的 react-router 0.13.x 同构(通用)设置 - 如何升级?

所以我继承了一个完整的项目,该项目遵循一些非正统的服务器端渲染方法,如下所述:Client Routing (using react-router) and Server-Side Routing

现在我在过去一周一直在尝试升级它,并且可能浪费了 40 多个小时而无处可去,同时我试图将这个烂摊子带到正确的当前状态。它使用 react 0.13.3,我想升级到至少 0.14.7 和 react-router 2,但无论我如何尝试解决这个问题,结构都非常脆弱,以至于我一次又一次地失败。这就是我所拥有的:

客户:

服务器:

serverModules(???)“索引”之一:

路线:

应用路由器:

应用程序处理程序:

这就是 LoginHandler 的样子:

如何升级它,最好升级到最新版本,如果可能,请逐步显示解决方案,因为我在一个多星期未能升级后感到非常愚蠢。我以前见过疯狂而脆弱的设置,但到目前为止,这很成功。我真的很沮丧,请帮助!

0 投票
2 回答
1383 浏览

javascript - 为什么不允许在 jquery 数据表服务器端处理 ajax 中使用成功?

我正在使用 asp.net mvc5 并尝试使用 jquery 数据表插件服务器端处理。服务器端处理的教程显示了从服务器返回结果的格式。但我的项目中的不同之处在于我无法从服务器发送“数据”的类型化数组。我将整个 tbody 作为带有所有 html 标签的字符串发送。我的数据表代码如下。

ajax 的结果如下所示,

数据就像

因为视图对于许多表来说是通用的,并且我应该控制很多情况。因此,我在服务器端使用 StringBuilder。如果我把成功的 ajax 分页元素消失在数据表的底部。为什么不允许在ajax中使用success?我拥有数据表的所有全部功能,有没有办法手动设置像 iTotalRecords 这样的功能?我知道这里不是数据表论坛。对此我很抱歉,但我花了很多时间却找不到解决方案。我想手动处理 ajax 成功中数据表的所有功能。我正在使用最新版本的数据表。

0 投票
0 回答
24 浏览

reactjs - 如何预防

我有一个显示自动播放视频标签的通用 React 应用程序。当 javascript 加载时,React 会包含它,但会从头开始重新启动视频。

有没有办法防止这种情况?

这也可以通过热重载来重现,因为这也会更新 DOM。

0 投票
1 回答
488 浏览

meteor - ssr 在流星中如何工作以及为什么要使用?

与没有 ssr 的相同包相比,meteor+react 与 ssr 有何不同。有什么区别 ?
例如,meteor 是否渲染服务器上的所有网页?或者它只是在服务器上渲染第一页还是什么?为什么要使用 ssr ?

0 投票
1 回答
5802 浏览

javascript - 使用 react.js 通过服务器端渲染在页面刷新后保持会话活动

虽然不确定这是否是一个特定的反应问题:

我们正在使用带有服务器端渲染的 react/redux 堆栈进行开发和应用。用户登录后,我们会收到两个 cookie,一个用于身份,一个用于浏览器中的会话(具有到期日期)。问题是当用户刷新页面时,状态正在重置并且我们丢失了会话信息(我们基本上在状态中设置了一些变量来指示用户已登录)。

问题是如何管理这种情况并即使在页面刷新时也让用户保持登录状态。我正在考虑将服务器端渲染完全排除在图片之外,并在最初渲染页面时在客户端检查未过期的会话 id cookie,如果会话仍然存在,则在状态中设置一些变量,反之亦然- 反之亦然。

这看起来像是一种安全的方法吗?有更好的方法吗?

0 投票
1 回答
1270 浏览

node.js - 在服务器端使用 React Server renderToString 的“不变违规”

我正在尝试使用 Webpack 设置同构服务器端渲染 React 应用程序,但是当我尝试使用 renderToString 将我的 React 代码转换为字符串时出现此错误:

当我使用 renderToString 函数注释掉该行时,我不再收到此错误(当然,该应用程序仍然无法运行 - 我只是不再收到错误消息)。

我试过传递 renderToString<RootApp />React.createElement(RoutingContext不是制造工厂,但这些都没有奏效。UsingReact.createElement导致了同样的错误,并且 using<RootApp />抛出了一个unexpected token < error.

以及对可能发生的事情的想法?

我的应用看起来像:

应用程序.js

应用程序.jsx

索引.ejs

0 投票
2 回答
2552 浏览

node.js - React/Redux 同构/服务器端渲染和媒体查询

我开始创建一个基于 Node.js 的同构 React/Redux 应用程序。该项目的一项要求是基于“移动”和“桌面”视图对特定组件进行“自适应”渲染。我已经实现了 Redux action 和 reducer 来在状态中存储有关用户视图的屏幕信息(基于媒体查询 - “small”、“medium”、“large”)。调整大小时,状态/商店会更新。默认状态是“小”。

在需要根据屏幕尺寸在两个不同版本中“自适应”呈现的组件中,我只需执行以下操作:

如果(小)返回变化1

如果(中等)返回变化2

都在工作。

现在我面临两个问题:

  1. 我的应用程序是同构的,这意味着标记也呈现在服务器端。服务器对用户的浏览器和媒体查询一无所知。所以因为我的默认状态是“small”,所以服务器总是会渲染“variation1”。节点服务器是站点的入口点。看起来渲染需要“延迟”(中间件?),并且服务器需要在 React 应用程序“交付”之前从客户端获取一些关于浏览器宽度的信息。知道如何解决这个问题吗?

  2. 因为渲染是基于状态的,所以即使浏览器大小是“桌面”,在加载后“变体 1”总是可以首先看到几毫秒(闪烁)。这是因为 JS 检测需要几毫秒才能将状态更新为当前屏幕宽度。我认为这与上述问题和默认状态一起发挥作用。

我找不到 1 的任何解决方案,但我想一定有一些同构和响应/自适应的东西。

0 投票
1 回答
74 浏览

meteor - Meteor 1.3 React SSR 支持

我正在使用带有 React 和 FlowRouter(SSR 版本)的 Meteor 1.3。我想实现 SSR,但是当我在我的服务器中导入我的路由文件时main.js,我收到一个错误,基本上说我的一个 npm 包正在调用window并且window在服务器上不存在。

有没有办法让我在仍然使用该软件包的同时以某种方式绕过这个问题?有问题的包裹是Wallop

0 投票
1 回答
2637 浏览

reactjs - 服务器端渲染通过 Ajax 加载状态的 React 组件

我正在努力使我的组件在客户端和服务器端都工作。

这是我的组件的代码:

它工作正常。当它通过客户端呈现时,它同时显示为h2h3,然后在 ajax 调用返回时填充它们。

当它通过服务器呈现时,我已经填充了这些道具,并且发送到客户端的 html 已经完成,不需要任何额外的东西。

问题是,当它在服务器上呈现时,我在客户端收到错误消息:

然后它再次调用 ajax 方法并重新渲染所有内容。

那么我应该如何处理这种情况呢?有没有办法告诉 React 这个组件是在服务器上呈现的,接受它而不调用该componentDidMount方法?