如何解析Json API提取圖像URL並將它們返回

Question

我是使用API​​的新手，我完全被使用API​​攔截，我必須在我的一個項目中使用它。 以下是我必須使用的API：https://api.dev.navigart.fr/890/artworks.json 我的目標是構建一個web應用程序，該應用程序允許其用戶搜索該API中的項目，然後將其保存在其「個人空間」中。

如何搜索該API中的輸入值，然後使用Jquery提取圖像的URL以將其顯示在div中？ API是如此複雜，我完全失去了:(

非常感謝您的幫助

Answer 1

首先，你需要使用顯示JSON樹結構的JSON觀衆的我用：。http://www.jsoneditoronline.org/

一旦你弄完都好辦（這裏是小提琴：http://jsfiddle.net/9b0a8fsv/）。使阿賈克斯調用API，並在「成功」做的事：

var results = data.results; 

     for (var i=0; i<results.length; i++){ 
      console.log('i: ' + i); 
      var article = $('<article/>'); 
      article.attr('id', results[i]['_id']); 
      // iterate through medias 
      var medias = results[i]['_source']['ua']['medias']; 

      if (medias){ 
       console.log(medias.length); 
       for (var j=0; j<medias.length; j++){ 
        // url format: http://images.navigart.fr/{size}/{file_name} 
        var imageURL = medias[j]['url_template']; 
        console.log(imageURL); 
        // replace params 
        imageURL = imageURL.replace('{size}', paramSize); 
        imageURL = imageURL.replace('{file_name}', medias[j]['file_name']); 

        // add to article 
        article.append($('<img/>').attr('src', imageURL)); 
       } 
      } 

      list.append(article); 

     }