使用 react-router-relay 和 react-rails 进行服务器端渲染

Posted 2023-03-08

【中文标题】使用 react-router-relay 和 react-rails 进行服务器端渲染

【英文标题】：server side rendering with react-router-relay and react-rails

【发布时间】：2016-04-11 12:23:54

【问题描述】：

我的服务器端是 rails，我正在使用 react-rails 和服务器端渲染（prerender：true）。最近开始使用带有 react-router-relay 的中继，但这样一来，服务器端渲染不再可能，因为显然获取数据涉及与涉及超时等的 graphql 服务器通信，这些在服务器渲染时不可用。 所以我想肯定有办法将数据预先注入到服务器端的中继存储中，以避免调用graphql。 我找到了这个库：https://github.com/denvned/isomorphic-relay-router，但我不能使用它，因为它与 react-rails 的使用不兼容（例如，我的应用程序中没有 app.get，所以没有地方可以使用该匹配功能那里提到）。关于如何使这项工作的任何想法？

【参考方案1】：

我们遇到了类似的问题。看看我们如何让它与 Rails 一起工作的实现。虽然我不建议这样做...

看看这个：https://github.com/brandfolder/rails-graphql-relay

更新：

我们遇到了一些与 ruby​​ 的阻塞特性有关的问题。为了解决这个问题，我们不得不拼凑出一个解决方案，将节点作为我们应用程序的一部分。

我们所做的是构建 3 个应用程序：

1) 一个兼容 JSONAPI 的公共 API，封装了我们所有的业务逻辑。 https://api.brandfolder.com/v2/docs 建立在 https://github.com/brandfolder/jsonapionify 之上

2) 与我们的 JSON API 对话的 GraphQL 服务器。注意：我强烈推荐 express-graphql（节点）。由于 node 的异步/非阻塞特性，express-graphql 能够一次对我们的 API 进行多次调用，而不是在 ruby​​ 中阻塞。 https://github.com/brandfolder/graphqlify

3) 服务于我们的 React/Relay 应用程序的应用程序。这只是一个带有 browserify 的资产管道，用于提供我们的反应代码。这还包含使用 ReactDOMServer 处理我们的服务器端渲染的代码。 [私人仓库]

这可能是一个比您正在寻找的更复杂的示例，但这允许使用它来运行高可用性的高性能生产应用程序。在您的情况下，您可以轻松摆脱 2 个应用程序，即 GraphQL 服务器和前端代码。这将允许前端编译，而不必担心后端阻塞 Ruby 中的 GraphQL 服务器。

【讨论】：

非常感谢！为什么不建议这样做？你会改进什么？还有其他选择吗？