如何在 Twitter 或 FB 等相同 URL 上提供静态页面 + 反应应用程序？答案

【问题标题】：How to serve static page + react app on same URL like Twitter or FB?如何在 Twitter 或 FB 等相同 URL 上提供静态页面 + 反应应用程序？
【发布时间】：2018-10-05 07:50:37
【问题描述】：

是否可以在未登录的情况下呈现静态网页，但如果之前登录则以某种方式加载 SPA (ReactJS)？还是那些“静态”网页只是应用程序的一部分？

我的意思是 Twitter.com 或 Facebook.com 以及如果您之前登录过它们如何立即加载应用程序，或者是可抓取的默认页面。

服务器端渲染是唯一的答案吗？还是有更简单的解决方案，因为大多数搜索引擎都可以抓取 JavaScript 网站？如果可能的话，我不想使用像 app.domain.com 这样的子域。

想法：大多数 ReactJS 教程从一个相当空的 index.html 开始，其中包含一个 React 应该呈现到的 div。具有实际内容的引导 html 怎么样？如果 React 检测到用户已经登录，然后动态删除这些静态内容？这通常是这样做的吗？有什么缺点？

【问题讨论】：

第一个 HTTP 请求通常有服务器端检查，您可以在 SPA 中设置路由器进行相应响应
你有没有想过这个问题？我现在正在处理一个类似的问题，并且很想听听您是否对如何执行此操作有任何想法

标签： reactjs firebase firebase-hosting server-side-rendering nextjs

【解决方案1】：

这可以通过在 react js 中使用 if else 条件来解决。

希望您从 api 中获取用户信息。

如果 api 为您提供了一些用户信息，那么您可以将这些信息存储在状态中并显示出来。

如果该状态为空，那么您可以显示您的静态页面。

通过这个你可以渲染静态页面并在同一页面上反应js。

希望这个答案能解决你的问题

【讨论】：