1

我正在尝试使用 react + react 路由器 + react 头盔应用程序设置 netlify 预渲染。我试图在抓取页面时在标签中显示页面标题和一些打开的图元标签。

这是调用 react-helmet 的代码：

    <Helmet>
      <title>{entry.title} — Road Trip en Islande</title>
      <meta name="description" content="Nested component" />
      <meta property="og:title" content={entry.title} />
      <meta property="og:url" 
        content={`https://roadtrips.iwazaru.fr/entry/${entry.id}`} />
    </Helmet>

来自https://github.com/iwazaru/road-trips/blob/fb0d93af1d441b5f4378ee5d3e6f3bf0724b22e3/src/components/Entry/Entry.js

它可以在浏览器中工作而无需预渲染： https ://roadtrips.iwazaru.fr/entry/S

当使用netlify prerender在本地进行预渲染时，它也可以工作，正确的标题和打开的图形标签会显示在预渲染的 html 中。

但是当使用 facebook 调试器抓取页面时，我放入 react 头盔的任何内容似乎都没有被预渲染，尽管页面的其余部分已正确预渲染： https ://developers.facebook.com/tools/debug/echo/?q= https%3A%2F%2Froadtrips.iwazaru.fr%2Fentry%2FS

难道我做错了什么 ？

4

1 回答 1

1

解决了。问题显然是index.html模板文件中有打开的图形元标记，在 react-helmet 之前加载。我仍然无法解释为什么在本地使用 prerender 而不是在使用 netlify 的 prerender 时会替换它们。

于 2018-06-07T07:26:03.523 回答