使用在S3上托管的react-router v3的Create-react-app不能使用“fetch as google”

时间:2018-05-03 21:00:20

标签: reactjs amazon-s3 react-router amazon-cloudfront google-crawlers

我目前使用通过CloudFront在S3上托管的react-router v3使用create-react-app构建了一个React应用程序。该应用程序是在其他地方托管的PHP API的视图。 react-router设置为使用browserHistory。

目前,我们正在尝试设置应用,以便Google可以对其进行抓取,并使用Google网站管理员工具和“以谷歌搜索”进行测试。

主页没有问题,但任何内部页面都无法呈现并返回“未找到”。

当尝试直接导航到新标签页中的路线时,该网站在控制台中仍然显示404错误(但是按预期加载页面)。

到目前为止我尝试过的事情: 1)在googlebot的入口点导入babel-polyfill。 2)设置CloudFront错误页面以使用200向/index.html发送404响应 3)将s3的错误页面设置为index.html

从我的阅读中,谷歌不应该要求服务器端渲染只是为了抓取网站(SEO不是我们关注的问题),但我在网上找到的其他解决方案似乎都无法解决问题。 / p>

我是否需要让整个应用程序能够处理SSR,简单如:https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#serving-apps-with-client-side-routing,或者还有其他我可以尝试的东西,只是让页面可以抓取而不设置任何服务器端?< / p>

任何有关进一步资源的帮助或指示都将不胜感激!

1 个答案:

答案 0 :(得分:2)

我发现解决方案非常简单。在云端分发中,将自定义错误页面设置为将404错误发送到目标&#34; /&#34; http响应为200。

很多其他人都将其与目标一起发布为&#34; /index.html"如果这不起作用,请尝试以上操作。