head标签在带有next / head的动态页面中不会更改

Question

我正在建立一个电子商务网站，并且正在制作产品详细信息页面。我需要根据产品属性更改页面的元标记。我正在使用next / head中的head组件。问题在于，仅当我使用chrome dev工具检查页面时，元数据才似乎发生了变化，但是当我选择查看源页面时，它们却没有出现。 对我来说很重要，因为服务器需要更改元数据，因为我需要使用og元数据进行Facebook共享。 我正在使用下一个v9，并且正在使用自定义服务器，也使用_document和_app prebuild页面。

这是我的_document页面

这是我的产品详细信息页面

在chrome视图页面源选项中，我只看到文档头的meta，而没有看到产品详细信息页面的

。

有人可以帮助我理解我如何大声使用头部吗？我尝试了几个例子，但都没有成功。

预先感谢，对不起我的英语。

Answer 1

也将key参数添加到您的_document.js元标记中。如果您的meta文件中有一个带有匹配密钥的pages，则将首先加载这些文件，然后覆盖（服务器端）。

还请注意-我认为冒号不能像产品详细信息页面中的key参数那样工作，也不能在元标记中使用property。

所以，如果您有这样的事情：

// _document.js
<meta key="ogType" name="og:type" content="website" />

...这将是页面上的默认元标记。但是，如果您有：

// pages/blog.js
<meta key="ogType" name="og:type" content="article" />

...在博客页面上，将使用og:type元标记。