How to get string from nested array from JSON array?

Question

JavaScript

Can you please tell me how to get a string from a JSON array of the second level?

There is a JSON array, this is an answer from Instagram for displaying the feed on the site.

{
            "node": {
                "__typename": "GraphSidecar",
                "id": "",
                "shortcode": "",
                "dimensions": {
                    "height": 1080,
                    "width": 1080
                },
                "display_url": "https://scontent-arn2-1.cdninstagram.com/v/......",
                "edge_media_to_tagged_user": {
                    "edges": []
                },
                "fact_check_overall_rating": null,
                "fact_check_information": null,
                "gating_info": null,
                "media_overlay_info": null,
                "media_preview": null,
                "owner": {
                    "id": "",
                    "username": ""
                },
                "is_video": false,
                "accessibility_caption": "",
                "edge_media_to_caption": {
                    "edges": [{
                        "node": {
                            "text": ""
                        }
                    }]
                },
                "edge_media_to_comment": {
                    "count": 7
                },
                "comments_disabled": false,
                "taken_at_timestamp": 1593419574,
                "edge_liked_by": {
                    "count": 72
                },
                "edge_media_preview_like": {
                    "count": 72
                },
                "location": null,
                "thumbnail_src": "https://scontent-arn2-1.cdninstagram.com/v/........",
                "thumbnail_resources": [
                    {
                    "src": "https://scontent-arn2-1.cdninstagram.com/v/........",
                    "config_width": 150,
                    "config_height": 150
                }, {
                    "src": "https://scontent-arn2-1.cdninstagram.com/v/.......",
                    "config_width": 240,
                    "config_height": 240
                }, {
                    "src": "https://scontent-arn2-1.cdninstagram.com/v/.......",
                    "config_width": 320,
                    "config_height": 320
                }, {
                    "src": "https://scontent-arn2-1.cdninstagram.com/v/.......",
                    "config_width": 480,
                    "config_height": 480
                }, {
                    "src": "https://scontent-arn2-1.cdninstagram.com/v/........",
                    "config_width": 640,
                    "config_height": 640
                }],
        
        
        
                "edge_sidecar_to_children": {
                    "edges": [
                        {
                        "node": {
                            "__typename": "GraphImage",
                            "id": "",
                            "shortcode": "",
                            "dimensions": {
                                "height": 1080,
                                "width": 1080
                            },
                            "display_url": "https://scontent-arn2-1.cdninstagram.com/v/........",
                            "edge_media_to_tagged_user": {
                                "edges": []
                            },
                            "fact_check_overall_rating": null,
                            "fact_check_information": null,
                            "gating_info": null,
                            "media_overlay_info": null,
                            "media_preview": "",
                            "owner": {
                                "id": "",
                                "username": ""
                            },
                            "is_video": false,
                            "accessibility_caption": ""
                        }
                    },
                     {
                        "node": {
                            "__typename": "GraphImage",
                            "id": "",
                            "shortcode": "",
                            "dimensions": {
                                "height": 1080,
                                "width": 1080
                            },
                            "display_url": "https://scontent-arn2-1.cdninstagram.com/v/........",
                            "edge_media_to_tagged_user": {
                                "edges": []
                            },
                            "fact_check_overall_rating": null,
                            "fact_check_information": null,
                            "gating_info": null,
                            "media_overlay_info": null,
                            "media_preview": "",
                            "owner": {
                                "id": "",
                                "username": ""
                            },
                            "is_video": false,
                            "accessibility_caption": ""
                        }
                    }]
                }
        
        
        
            }
        },

I display it on the site like this

function getInstagramFeed(username, container, items) {
  if(!$(container).length)
    return false;
  items = items || 32;
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if(xmlhttp.readyState==4 && xmlhttp.status==200) {
      data = xmlhttp.responseText;
      data = data.split("window._sharedData = ");
      data = data[1].split("<\/script>");
      data = data[0];
      data = data.substr(0, data.length-1);
      data = JSON.parse(data);
      data = data.entry_data.ProfilePage[0].graphql.user;
      if(data.is_private) {
        console.log('This account is private');
        return false;
      }
      else {
        var imgs = data.edge_owner_to_timeline_media.edges;
        max = (imgs.length>items) ? items : imgs.length;
        if(!max)
          return false;
        var html = "<div class='ig-wrapper'><div class='ig-container'>";
        

        for(var i=0; i<max; i++) {
          var url = "https://www.instagram.com/p/"+ imgs[i].node.shortcode +"/";
          var type = "";
          if(imgs[i].node.__typename=="GraphVideo")
            type = " class='video'";
          else if(imgs[i].node.__typename=="GraphSidecar")
            type = " class='series'";
          
          var caption = imgs[i].node.edge_media_to_caption.edges[0].node.text;
          caption = caption.replace(/#/g," #");
          caption = caption.replace(/(•\n)|#(.+?)(?=[\s.,:,]|$)/g, "");
          caption = caption.replace(/\n/g,"<br/>");
          caption = caption.replace(/[\s]{2,}/g," ");
          caption = caption.trim();
          if(caption)
          caption = "<span>"+ caption +"</span>\n";
          var like = imgs[i].node.edge_media_preview_like.count; 
          if(like)
          like = "<div>Лайков: "+ like +"</div>\n";
          var comments = imgs[i].node.edge_media_to_comment.count; 
          if(comments)
          comments = "<div>Комментариев: "+ comments +"</div>\n";
          
          var big = imgs[i].node.edge_sidecar_to_children.edges[0].display_url; 
          if(big)
          big = "<div>"+ big +"</div>\n";
          
          html += "<div class='single_item'>";
          html += "<a style='background-image:url("+ imgs[i].node.thumbnail_resources[4].src +");' href='"+ url +"' target='_blank'"+ type +">";
          html += caption;
          html += "</a>";
          html += like;
          html += comments;
          html += big;
          html += "</div>";
        }

        html += "</div></div>";
      }
      $(container).html(html);
    }
  }
  xmlhttp.open("GET", "https://www.instagram.com/"+ username +"/", true);
  xmlhttp.send();
}

getInstagramFeed("moya_planeta", "#instagramfeed", 32);

BUT I can’t get the parameter from the edge_sidecar_to_children array, the display_url parameter and write it to VAR big, but
it gives an error right away :(
Uncaught TypeError: Cannot read property 'edges' of undefined

What's wrong? Please tell me!!!!

Answer 1

How much extra code ...
Display what JSON.parse (data) returns to you.
Maybe a nesting error.