如何僅使用JAVASCRIPT獲取數據值

Question

如何僅使用Javascript獲取數據值而不使用eval？

jsonFlickrFeed({ 
    "title": "Recent Uploads tagged punctuation and atsign", 
    "link": "http:\/\/www.flickr.com\/photos\/", 
    "description": "", 
    "modified": "2014-01-09T15:40:57Z", 
    "generator": "http:\/\/www.flickr.com", 
    "items": [ 
    { 
    ..... 
    ..... 

Answer 1

基本上可以有人告訴我如何解析這個網址的數據？ http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json

你並不意味着解析這一點。這是一個老派JSONP的迴應。這種或那種方式，它必須進行評估。 JSONP歷史上用於做CORS（跨源資源共享），其中正確的CORS是不可能的。

您必須在程序中定義jsonFlickrFeed，然後

<script type="application/javascript" 
     src="http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json"> 
</script> 

這將導致jsonFlickrFeed與數據對象被調用。

注意：術語JSON在此處被濫用，因爲jsonFlickrFeed實際上是接受JavaScript對象;不是JSON 字符串。

JSONP回調：通常情況下，您可以通過將&callback=foo傳遞給JSONP請求來配置回調的名稱。我嘗試使用您提供的flickr URL，但它們的API以某種方式運行不同，或不支持用戶命名的回調。檢查他們的API並查看是否可以按照明智的命名約定指定回調。

---

下面是一個功能完整的演示，向您展示它的工作原理。我們會將3段響應數據寫入控制檯; title，link和modified。很明顯，你可以用數據做任何你想做的事情。

<script> 
 
    function jsonFlickrFeed (data) { 
 
    console.log("title", data.title) 
 
    console.log("link", data.link) 
 
    console.log("modified", data.modified) 
 
    } 
 
</script> 
 

 
<script type="application/javascript" 
 
     src="http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json"> 
 
</script>

這裏的另一個演示顯示在items屬性

body { 
 
    display: flex; 
 
    flex-direction: row; 
 
} 
 

 
img { 
 
    display: flex; 
 
    max-height: 50px; 
 
}

<script> 
 
    function makeImage (src) { 
 
    return Object.assign(document.createElement('img'), {src}) 
 
    } 
 
    
 
    function jsonFlickrFeed (data) { 
 
    for (let {media: {m}} of data.items) 
 
     document.body.appendChild(makeImage(m)) 
 
    } 
 
</script> 
 

 
<script type="application/javascript" 
 
     src="http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json"> 
 
</script>

在任一示例圖像，請注意，我沒有手動解析任何東西。這裏沒有JSON，所以沒有什麼可以解析的。

Answer 2

根據下面的評論，你有這樣的代碼：

var request = new XMLHttpRequest(); 
request.open("GET", "json/flickr.json", false); 
request.send(null) 
var response_object = (request.response); 
console.log(response_object); 
function jsonFlickrFeed(json){ 
    var obj = JSON.parse(json); 
    console.log(obj); 
} 

問題是響應不是100％正確格式的JSON。主要內容是嵌入在這似乎是一個函數調用：

`jsonFlickrFeed(main content here)` 

你必須去除包裝，然後你可以在剩下的字符串中使用JSON.parse：

var response_object = request.responseText.replace("jsonFlickrFeed(", "").substr(0,str.length-1)); 
    var obj = JSON.parse(response_object); 

而且，從您顯示的代碼中，您尚未爲XHR完成時設置load回調。