动态Schema Markup配置报错求助：JSON-LD语法错误

错误原因 #

你遇到的JSON-LD Syntax error: value, object or array expected错误，本质是JSON-LD要求严格遵循JSON格式，但你的代码里直接嵌入了document.querySelector()、window.location.href这类JavaScript表达式——JSON不允许包含可执行代码，只能识别字符串、数字、布尔值、对象、数组、null这些静态值，验证工具会把整个内容当作纯JSON解析，自然会报错。

修复方案 #

方案1：用JavaScript动态生成合法的JSON-LD #

把DOM数据获取逻辑和JSON结构分离，先拿到页面元素的值，再组装成JS对象，最后转成合法的JSON字符串插入页面：

<script>
// 封装获取元素内容的工具函数，处理元素不存在的情况
const getText = (selector) => document.querySelector(selector)?.innerText || '';
const getSrc = (selector) => document.querySelector(selector)?.src || '';

// 组装Schema数据结构
const productSchema = {
  "@context": "http://schema.org",
  "@type": "Product",
  "name": getText("#product-title"),
  "description": getText("#product-description"),
  "image": getSrc("#product-image"),
  "url": window.location.href,
  "sku": getText("#product-sku"),
  "brand": getText("#product-brand"),
  "offers": {
    "@type": "Offer",
    "availability": `http://schema.org/${getText("#product-availability")}`,
    "price": getText("#product-price"),
    "priceValidUntil": "2019-12-31",
    "priceCurrency": "CNY", // 替换成实际货币代码，比如USD、EUR
    "url": window.location.href
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "bestRating": "5",
    "ratingValue": "5",
    "reviewCount": "3"
  },
  "review": [
    {
      "@type": "Review",
      "author": getText("#review-author-1"),
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": getText("#review-rating-1"),
        "worstRating": "1"
      },
      "reviewBody": getText("#review-body-1")
    },
    {
      "@type": "Review",
      "author": getText("#review-author-2"),
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": getText("#review-rating-2"),
        "worstRating": "1"
      },
      "reviewBody": getText("#review-body-2")
    },
    {
      "@type": "Review",
      "author": getText("#review-author-3"),
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": getText("#review-rating-3"),
        "worstRating": "1"
      },
      "reviewBody": getText("#review-body-3")
    }
  ]
};

// 创建并插入符合规范的JSON-LD脚本
const script = document.createElement('script');
script.type = 'application/ld+json';
script.textContent = JSON.stringify(productSchema);
document.head.appendChild(script);
</script>

关键说明：

• 用?.可选链操作符避免DOM元素不存在时抛出错误
• 通过JSON.stringify()把JS对象转成纯JSON字符串，完全符合JSON-LD格式要求
• 替换priceCurrency为实际业务中的货币代码（比如"USD"、"EUR"）

方案2：服务端渲染时填充静态JSON #

如果你的页面是服务端生成的（比如PHP、Node.js、Python），可以直接在后端把数据填充到JSON结构中，输出纯静态的JSON-LD：

以PHP为例：

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Product",
  "name": "<?php echo htmlspecialchars($product['title']); ?>",
  "description": "<?php echo htmlspecialchars($product['description']); ?>",
  "image": "<?php echo htmlspecialchars($product['image_url']); ?>",
  "url": "<?php echo htmlspecialchars($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']); ?>",
  "sku": "<?php echo htmlspecialchars($product['sku']); ?>",
  "brand": "<?php echo htmlspecialchars($product['brand']); ?>",
  "offers": {
    "@type": "Offer",
    "availability": "http://schema.org/<?php echo htmlspecialchars($product['availability']); ?>",
    "price": "<?php echo htmlspecialchars($product['price']); ?>",
    "priceValidUntil": "2019-12-31",
    "priceCurrency": "CNY",
    "url": "<?php echo htmlspecialchars($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']); ?>"
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "bestRating": "5",
    "ratingValue": "5",
    "reviewCount": "3"
  },
  "review": [
    <?php foreach($product['reviews'] as $key => $review): ?>
    {
      "@type": "Review",
      "author": "<?php echo htmlspecialchars($review['author']); ?>",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "<?php echo htmlspecialchars($review['rating']); ?>",
        "worstRating": "1"
      },
      "reviewBody": "<?php echo htmlspecialchars($review['body']); ?>"
    }<?php echo ($key !== count($product['reviews'])-1) ? ',' : ''; ?>
    <?php endforeach; ?>
  ]
}
</script>

关键说明：

• 后端直接将业务数据填充到JSON结构，输出的是纯静态JSON，完全符合JSON-LD规范
• 使用htmlspecialchars转义特殊字符，避免XSS攻击和JSON语法错误

验证建议 #

修复完成后，用结构化数据验证工具检查，确保没有语法错误和数据缺失。

内容的提问来源于stack exchange，提问作者DevX