如何將JSON-LD從內聯移動到文件中？

Question

我有一個帶有JSON-LD的HTML文檔，發布如下：

<script type="application/ld+json">
    {
           "@context": {
               "gs1": "http://vocab.gs1.org/v1#",
               "xsd":"http://www.w3.org/2001/XMLSchema#"
           },
           "@id": "retailer:12345",
           "@type": "gs1:Offering",
           "gtin13":"5011476100111",
           "gs1:hasPrice": {
               "gs1:price": "2.49",
               "gs1:priceTypeCode": "USD",
               "@type":"gs1:Price"
           }
      }
</script>

這可以按預期工作（意味着它使用Google Structured Data Testing Tool和Structured Data Linter有效且可見）

使用Same Origin （ 不是 Cross Origin ），如何將內聯JSON-LD到文件中？

這種方法失敗了：

<script type="application/ld+json" src="_URL_.json"></script>

這種方法也失敗了：

<script type="application/ld+json">
        $(document).ready(function(){
            $.ajax({
                url: "_URL_.json",
                dataType: 'json',
                });        
        });
</script>

如何糾正我的方法來創建一個解決方案，其中JSON-LD在我的服務器上，而不是在HTML中？

接下來，假設我的站點已啟用CORS。

如何以JSONP格式發布JSON-LD結構，以便另一個域可以訂閱JSON-LD數據？

Answer 1

Google結構化數據測試工具或結構化數據Linter等 工具不支持外部參考。 也許你JSON-LD的許多消費者都沒有。

如果你想要這樣做，你必須使用一個link而不是一個script元素 ，因為為了用作數據塊 ， script元素可能沒有src屬性。

動態包含JSON-LD的變體可能適用於為此目的支持JavaScript的消費者。 （ 谷歌似乎支持它 ;也許它只是他們的測試工具不能使用它。）

Answer 2

您可以動態生成腳本標記：

<script>
  // do some ajax, get the JSON-LD as `data` and then...
  $.ajax(...).done(function(data) {
    var el = document.createElement('script');
    el.type = 'application/ld+json';
    el.text = JSON.stringify(data);
    document.querySelector('body').appendChild(el);
  });
</script>