在React for crawlers

时间:2016-03-15 10:21:02

标签: reactjs react-router redux react-router-redux

我有一个使用客户端渲染的React(redux)应用程序。我希望我的网站描述和标题可以被谷歌抓取(它们似乎抓取异步的东西,因为我的网站在谷歌中显示我的h1标签中的文字很好)所以我找到了一个名为react-helmet的库,它建立在react-document-图书馆。这个库允许我根据我当前的路线更改文档标题和描述。

所以这是我的问题:

  1. 目前(1周后)我的谷歌搜索结果没有变化,这让我觉得谷歌没有抓取我的网站或谷歌抓取它但没有注意到描述的动态变化,只是使用了我的h1标签。但是我如何检查发生了哪一个?
  2. 我注意到Instagram有一个客户端呈现的应用程序但不知何故,当我检查页面源时,他们已经更改了每个页面上的标题和描述,即使body标签只是一个空div,这是典型的客户端呈现应用程序。我不知道他们怎么能这样做。
  3. react-helmet

2 个答案:

答案 0 :(得分:1)

按照React Helmet服务器渲染文档:https://github.com/nfl/react-helmet#server-usage

答案 1 :(得分:1)

使用Google Search Console查看Google如何抓取您的网站,以及启动网页抓取/索引:https://www.google.com/webmasters/tools/

至于instagram如何在客户端应用程序中显示元标记 - 当他们检测到爬虫或机器人正在查看时,它们可能会呈现并提供静态内容服务器端。您可以自己为内容执行此操作,而无需将整个应用程序转换为服务器端呈现。谷歌预呈现服务。 (我不会提及任何例子,因为我不想在没有意见的情况下提高他们的搜索引擎优化。)

另一种选择是静态渲染您的React应用程序,并在必要时提供它。请参阅Graphcool的准备(似乎稍微过时),react-snap和react-snapshot。所有这些都在本地服务器上呈现网站并下载呈现的html文件。如果你需要的只是<head>那么你应该是好的!