Vue.js 如何将结构化数据（json ld）添加到Vue？

添加到vue应用程序的正确方法是什么

---

我添加了一些结构化数据，但没有在我的url中检测到数据。但是，如果我查看url的来源并粘贴到测试工具中，它会检测到我的数据。我缺少什么？

可以使用VueJS添加JSON-LD的一种方法是使用

v-html

，如下面的示例所示

您可以在中的Schema.org和VueJS中找到有关结构化数据的更多信息

这也可以帮助你做到这一点

<script>
export default {
  data () {
    const jsonld = {
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Books",
        "item": "https://example.com/books"
      }, {
        "@type": "ListItem",
        "position": 2,
        "name": "The Lord of the Rings",
        "item": "https://example.com/books/the-lord-of-the-rings"
      }]
    }
    return {
      jsonld
    }
  }
}
</script>
<template>
  <script v-html="jsonld", type="application/ld+json">
</template>

导出默认值{
数据（）{
常数jsonld={
“@context”：”https://schema.org",
“@type”：“面包屑列表”，
“itemListElement”：[{
“@type”：“ListItem”，
"立场":一,，
“名称”：“书籍”，
“项目”：https://example.com/books"
}, {
“@type”：“ListItem”，
"立场":二,，
“名字”：“指环王”，
“项目”：https://example.com/books/the-lord-of-the-rings"
}]
}
返回{
jsonld
}
}
}

是否使用服务器端渲染？您应该这样做。在我看来，如果JsonLd使用的部分数据来自不受信任的源，那么XSS很容易受到攻击。只需将数组中的值替换为“警报”（“黑客”）；“