Доступ к объектам JSON-LD создает ошибку - инструмент тестирования данных структуры Google

Question

Я перебираю объекты JSON-LD, чтобы создать список отзывов пользователей, и это работает здесь, в JSFiddle (https://jsfiddle.net/vmgn1ykb/), но когда я добавляю его на свою страницу, используя примеры или тест на структурированных данных Googleинструмент тестирования Я получаю сообщение об ошибке «Синтаксическая ошибка JSON-LD: ожидаемое значение, объект или массив». Код не запускается. Пожалуйста, помогите мне понять, почему.

Я попытался изменить

 var arrayLength =  jsonld['review'].length;

что-то вроде

 JSON.parse(document.querySelector('script[type="application/ld+json"]').innerText)

и

 JSON.parse(document.querySelector('script[id="jsonData"]').innerText)

Но все равно код не запускается и ошибка в GSDTT сохраняется. Пожалуйста, помогите понять, что я делаю неправильно.

Это работает,

var jsonld = {

"@context": "http://schema.org",
"@type": "Product",
"image": "https://www.myurl.com/media/db3e3b23f81585_M.jpg",
"name": "Test name",
"description": "Test review desc.",
"offers": {
    "@type": "AggregateOffer",
    "availability": "http://schema.org/InStock",
     "highPrice": "5195.00",
     "lowPrice": "2595.00",
      "offerCount": "1",
    "priceCurrency": "ZAR",
    "priceValidUntil": "2020-09-30",
    "url": "https://www.myurl.com/"
  }
,
"aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "5",
    "bestRating": "5",
    "reviewCount": "2"
  },
"review": [
    {
      "@type": "Review",
      "author": " Meagen",
      "description": "Test review desc",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "5",
        "worstRating": "1"
      }},
        {
      "@type": "Review",
      "author": " Ericka",
      "description": "Test review desc",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "5",
        "worstRating": "1"
      }}
      ]}

var arrayLength =  jsonld['review'].length;

outline = document.createElement('div');
outline.className = 'outline';
document.getElementsByTagName('body')[0].appendChild(outline);

for (i = 0; i < arrayLength; i++) {
    inside = document.createElement('div');
inside.className = 'inside';
document.getElementsByClassName('outline')[0].appendChild(inside);

//desc
desc = document.createElement('div');
desc.className = 'desc';
desc.innerHTML = JSON.stringify(jsonld.review[i].description);
document.getElementsByClassName('inside')[i].appendChild(desc);
//auth
auth = document.createElement('p');
auth.className = 'author';
auth.innerHTML = jsonld.review[i].author + " rated this tour " + jsonld.review[i].reviewRating.ratingValue + " out of 5";
document.getElementsByClassName('inside')[i].appendChild(auth);
//score
score = document.createElement('p');
score.className = 'score';
score.innerHTML = jsonld.review[i].reviewRating.ratingValue + " out of 5";
document.getElementsByClassName('inside')[i].appendChild(score);
}

Но когда я добавляю его на свою страницу, используя теги сценария type = "application / ld + json, это не так,

<script id="jsonData" type="application/ld+json">
var jsonld = {

"@context": "http://schema.org",
"@type": "Product",
"image": "https://www.myurl.com/media/db3e3b23f81585_M.jpg",
"name": "Test name",
"description": "Test review desc.",
"offers": {
    "@type": "AggregateOffer",
    "availability": "http://schema.org/InStock",
     "highPrice": "5195.00",
     "lowPrice": "2595.00",
      "offerCount": "1",
    "priceCurrency": "ZAR",
    "priceValidUntil": "2020-09-30",
    "url": "https://www.myurl.com/"
  }
,
"aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "5",
    "bestRating": "5",
    "reviewCount": "2"
  },
"review": [
    {
      "@type": "Review",
      "author": " Meagen",
      "description": "Test review desc",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "5",
        "worstRating": "1"
      }},
        {
      "@type": "Review",
      "author": " Ericka",
      "description": "Test review desc",
      "reviewRating": {
        "@type": "Rating",
        "bestRating": "5",
        "ratingValue": "5",
        "worstRating": "1"
      }}
      ]}
</script>        

<script type="text/javascript">
var arrayLength =  jsonld['review'].length;

outline = document.createElement('div');
outline.className = 'outline';
document.getElementsByTagName('body')[0].appendChild(outline);

for (i = 0; i < arrayLength; i++) {
    inside = document.createElement('div');
inside.className = 'inside';
document.getElementsByClassName('outline')[0].appendChild(inside);
//desc
desc = document.createElement('div');
desc.className = 'desc';
desc.innerHTML = JSON.stringify(jsonld.review[i].description);
document.getElementsByClassName('inside')[i].appendChild(desc);
//auth
auth = document.createElement('p');
auth.className = 'author';
auth.innerHTML = jsonld.review[i].author + " rated this tour " + jsonld.review[i].reviewRating.ratingValue + " out of 5";
document.getElementsByClassName('inside')[i].appendChild(auth);
//score
score = document.createElement('p');
score.className = 'score';
score.innerHTML = jsonld.review[i].reviewRating.ratingValue + " out of 5";
document.getElementsByClassName('inside')[i].appendChild(score);
}
</script>

Answer 1

Это то, что я закончил, и теперь он прекрасно работает. Также была проблема, что rev не ссылался на правильный контейнер, duh .. изменен на getElementsByClassName и исправлен.

document.getElementsByClassName('rev')[0].appendChild(outline);

Полный код ..

            <script id="jsonData" type="application/ld+json">
            {
                "@context": "http://schema.org",
                "@type": "Product",

                "image": "https://www.myurl.com/media/k2/items/cache/3899dfe821813b23f81585_M.jpg",
                "name": "prod name",
                "description": "prod desc",
                "offers": {
                    "@type": "AggregateOffer",
                    "availability": "http://schema.org/InStock",
                    "highPrice": "5195.00",
                    "lowPrice": "2595.00",
                    "offerCount": "1",
                    "priceCurrency": "ZAR",
                    "priceValidUntil": "2020-09-30",
                    "url": "https://www.myurl.com/url"

                }
            ,
                    "aggregateRating": {
                    "@type": "AggregateRating",
                    "ratingValue": "5",
                    "bestRating": "5",
                    "reviewCount": "2"
                },

                "review": [
                    {
                    "@type": "Review",
                    "author": " Mea",
                    "description": "Test desc",
                    "reviewRating": {
                        "@type": "Rating",
                        "bestRating": "5",
                        "ratingValue": "5",
                        "worstRating": "1"
                    }},
                        {
                    "@type": "Review",
                    "author": " Eric",
                    "description": "Test desc",
                    "reviewRating": {
                        "@type": "Rating",
                        "bestRating": "5",
                        "ratingValue": "5",
                        "worstRating": "1"
                    }}
                    ]
            }

                </script>
                <div class="rev"> 
            </div>
                <script type="text/javascript">



            var jsonld = JSON.parse(document.querySelector("#jsonData").innerText);

            var arrayLength = JSON.parse(jsonld['aggregateRating'].reviewCount);

            outline = document.createElement('div');
                outline.className = 'outline';
                document.getElementsByClassName('rev')[0].appendChild(outline);

            for (i = 0; i < arrayLength; i++) {

                    inside = document.createElement('div');
                inside.className = 'inside';
                document.getElementsByClassName('outline')[0].appendChild(inside);

                //desc
                desc = document.createElement('div');
                desc.className = 'desc';
                desc.innerHTML = JSON.stringify(jsonld.review[i].description);
                document.getElementsByClassName('inside')[i].appendChild(desc);
            //auth
                auth = document.createElement('p');
                auth.className = 'author';
                auth.innerHTML = jsonld.review[i].author + " rated this tour " + jsonld.review[i].reviewRating.ratingValue + " out of 5";
                document.getElementsByClassName('inside')[i].appendChild(auth);
                //score
                score = document.createElement('p');
                score.className = 'score';
                score.innerHTML = jsonld.review[i].reviewRating.ratingValue + " out of 5";
                document.getElementsByClassName('inside')[i].appendChild(score);

            }
            </script>