2017-03-10 47 views
0

为什么console.log('Your query count: ' , data);显示为空? (即使结果是成功和调试控制台网络选项卡显示的数据是成功抓取?)Javascript - 如何获取清单json并将其用作对象?

enter image description here

manifest.json的:

{ 
    "title": "API test", 
    "server": [ 
    { "agent": "abc",   
     "url": "def" },   
    ], 
} 

的index.php:

<script> 
var getJSON = function(url, callback) { 
    var xhr = new XMLHttpRequest(); 
    xhr.open('GET', url, true); 
    xhr.responseType = 'json'; 
    xhr.onload = function() { 
     var status = xhr.status; 
     if (status == 200) { 
     callback(null, xhr.response); 
     } else { 
     callback(status); 
     } 
    }; 
    xhr.send(); 
}; 

getJSON('http://localhost/manifest.json', 
function(err, data) { 
    if (err != null) { 
    alert('Something went wrong: ' + err); 
    } 
    else { 
    var read = JSON.stringify(data); 
    console.log('Your query count: ' , data); 
    } 
}); 
</script> 

回答

2

您的代码适用于我,但请尝试

var read = JSON.stringify(data); 
console.log('Your query count: ' , read); 

代替

var read = JSON.stringify(data); 
console.log('Your query count: ' , data); 

编辑:噢,它看起来像你的manifest.json是不正确的JSON。尝试删除逗号

{ 
"title": "API test", 
"server": [{ 
    "agent": "abc", 
    "url": "def" 
}] 
} 
+0

还是一样的。即使有数据也是null。 – YumYumYum

+1

编辑我的回答@YumYumYum –

1

你的代码没问题。 但是,我注意到你的JSON有一个,

{ 
    "title": "API test", 
    "server": [ 
    { "agent": "abc",   
     "url": "def" },   
    ],<-- this one 
} 

只是将其删除,你的代码将工作。 另外在getJSON的匿名函数中的else操作符中,将data替换为read,您将得到JSON作为字符串,或者您可以从data变量中获取数据。在这里你有3种选择来获取数据。

var getJSON = function(url, callback) { 
 
    var xhr = new XMLHttpRequest(); 
 
    xhr.open('GET', url, true); 
 
    xhr.responseType = 'json'; 
 
    xhr.onload = function() { 
 
    var status = xhr.status; 
 
    if (status == 200) { 
 
     callback(null, xhr.response); 
 
    } else { 
 
     callback(status); 
 
    } 
 
    }; 
 
    xhr.send(); 
 
}; 
 

 
getJSON('https://gist.githubusercontent.com/teocci/3d128c27e37cc5d9b90ade9d68e84ca7/raw/e49f9d765567572aa4119142dc46ea5cc55d9b15/manifest.json%2520', 
 
    function(err, data) { 
 
    if (err != null) { 
 
     alert('Something went wrong: ' + err); 
 
    } else { 
 
     var read = JSON.stringify(data); 
 
     console.log('Your query count: ', read); 
 
     getInfoA(data); 
 
     getInfoB(data); 
 
     getInfoC(data); 
 
    } 
 
    }); 
 

 
function getInfoA(jsonData) { 
 
    var title = jsonData.title; 
 
    var server = jsonData.server; 
 
    var agent = server[0].agent; 
 
    var url = server[0].url; 
 

 
    console.log('getInfoA---'); 
 

 
    console.log('title: ', title); 
 
    console.log('agent: ', agent); 
 
    console.log('url: ', url); 
 
} 
 

 
function getInfoB(jsonData) { 
 
    var title = jsonData.title; 
 
    var server = jsonData.server; 
 

 
    console.log('getInfoB---'); 
 
    console.log('title: ', title); 
 

 
    Object.keys(server).map(function(key, index) { 
 
    var item = server[key]; 
 
    var agent = item.agent; 
 
    var url = item.agent; 
 
    console.log('agent: ', agent); 
 
    console.log('url: ', url); 
 
    }); 
 
} 
 

 
function getInfoC(jsonData) { 
 
    var title = jsonData.title; 
 
    var server = jsonData.server; 
 
    console.log('getInfoC---'); 
 
    console.log('title: ', title); 
 
    Object.keys(server).forEach(function(key) { 
 
    var item = server[key]; 
 
    var agent = item.agent; 
 
    var url = item.agent; 
 
    console.log('agent: ', agent); 
 
    console.log('url: ', url); 
 
    }); 
 
}

相关问题