React JSON-LD模式中的脚本标签

Question

摘要

我正在将Schema.org JSON-LD结构化数据实现到内容非常繁重的React应用程序中。我已经正确设置了所有设置，但是我在质疑设置方法是最佳实践还是可以接受？

问题

我在每个元素的代码正文中都缩小了标签。我质疑这种方法，因为在整个身体中都具有脚本标签似乎比将所有JSON-LD合并到1个大脚本标签下的head标签中合并效率低。

示例： 假设我有一个电子商务类别，页面上有很多产品。每个产品都包含在<div>中。在每个产品div中，我都提供一个schema.org标记。

<div className="product-1-example">
    <script type="application/ld+json">{"@context":"http://schema.org/", "@type":"Product","name":"3rd thing"}</script>
</div>
<div className="product-2-example">
    <script type="application/ld+json">{"@context":"http://schema.org/", "@type":"Product","name":"3rd thing"}</script>
</div>

如果上面的示例对代码的输出方式没有帮助，请使用以下屏幕截图：

这是可以的方法吗？对我来说，到处都是这样的脚本标签似乎很奇怪？我也遇到的问题是由于我的组件结构，我不能真正在顶部将1个漂亮的标签与所有合并的结构化数据捆绑在一起（即将所有产品JSON-LD数据分组为1个）。我也许可以在大多数数据的顶部构建一个脚本标签，然后用微数据填充其余的数据？

Answer 1

真正了解的唯一方法是使用您要读取标记的系统进行测试。

没有理由这样做是错误的。我认为它是在系统处理这些实体时添加的。也许更明智的做法是，在可能的情况下，让每个脚本的顶部都添加自己的脚本，而不是内联。

我个人更喜欢将实体保留在自己的脚本中。如果其中一个存在错误，则不会阻止其他错误的解析。您可以让实体通过其ID相互引用。

尽量不要与微数据混合。您不能在两者之间交叉引用ID。

您可能还需要考虑您的实体结构。通常，您只需要一个主要的顶层实体来表示页面的内容。其他一些顶级实体也很好，因为它们被认为与WebPage有关，例如面包屑列表。但是您不想发送混合消息。例如如果您标记10个产品，那么页面就是哪一个？如果您标记产品和文章。页面是文章还是关于产品？