[英]$.getJSON not returning anything despite success
I'm relatively new to the whole jQuery thing, so apologies if this is a really obvious thing. 对于整个jQuery,我还是比较陌生的人,因此,如果这确实很明显,我深表歉意。
My basic problem is that the URL within the .getJSON() function is not returning anything despite the JSON file being valid. 我的基本问题是,即使JSON文件有效,.getJSON()函数中的URL也不会返回任何内容。
jQuery: jQuery的:
$(document).ready(function() {
var key = '*****************'
var getMusic = function() {
$.getJSON('http://developer.echonest.com/api/v4/song/search?api_key=' + key + '&artist=led+zeppelin', function(data) {
$('.songs').append('<li>success</li>');
data['songs'].forEach(function(d) {
$('.songs').append('<li>' + d['title'] + '</li>');
});
});
};
$('.click').click(getMusic);
});
So the "success" gets appended to the list, but nothing else does. 因此,“成功”将附加到列表中,但没有其他操作。 The debug console in Chrome gives me the following error: Uncaught TypeError: Cannot read property 'forEach' of undefined
Chrome中的调试控制台给我以下错误: Uncaught TypeError: Cannot read property 'forEach' of undefined
I'm assuming this means that the URL is not passing anything to the function. 我假设这意味着URL没有将任何内容传递给该函数。 But the URL is valid. 但是该URL有效。 If I just type it into Chrome, I get the following response. 如果我只是将其键入Chrome,则会收到以下响应。
{
"response":{
"status":{
"version":"4.2",
"code":0,
"message":"Success"
},
"songs":[
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOWOYIL14EEE38DB16",
"artist_name":"Led Zeppelin",
"title":"St. Tristan's Sword (Rough Mix)"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOWTZWK12A6D4FC7A8",
"artist_name":"Led Zeppelin",
"title":"Rock And Roll - 2007 Remastered Version Live Version From The Song Remains The Same"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOWYEOY14EEE39630C",
"artist_name":"Led Zeppelin",
"title":"Bring It On Home (Rough Mix)"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXAPFT12AF72A0776",
"artist_name":"Led Zeppelin",
"title":"The Ocean (Live Album Version)"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOTYJLS12A8C13B4A9",
"artist_name":"Led Zeppelin",
"title":"Somethin' Else - \"Tasty Pop Sundae\" Live Version From BBC Sessions"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOUQMIU12B0B8083DF",
"artist_name":"Led Zeppelin",
"title":"1-06 For Your Life"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOUKOUX12B0B80B0BA",
"artist_name":"Led Zeppelin",
"title":"308 - The Song Remains The Same"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXXFOR12A8C13A5C6",
"artist_name":"Led Zeppelin",
"title":"Whole Lotta Love - \"Top Gear\" Live Version From BBC Sessions"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXHHNN14DB525B914",
"artist_name":"Led Zeppelin",
"title":"Heartbreaker (For Voice)"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXWXGG12B0B80B0AF",
"artist_name":"Led Zeppelin",
"title":"1-07 Trampled Underfoot"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXWUUS12B0B80B0D9",
"artist_name":"Led Zeppelin",
"title":"412 - Moby Dick -- Bonzo's Montreux"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXVXFK12B0B80B0C2",
"artist_name":"Led Zeppelin",
"title":"02 Going to California"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXZGKC12A8C13B4C9",
"artist_name":"Led Zeppelin",
"title":"Heartbreaker - \"In Concert\" Live Version From BBC Sessions"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOXEDBF14EC9C340F9",
"artist_name":"Led Zeppelin",
"title":"10 Ribs & All/Carrot Pod Pod (Pod) (Reference Mix)"
},
{
"artist_id":"ARDIBRT1187B9AF176",
"id":"SOYIZYO12C106D04DB",
"artist_name":"Led Zeppelin",
"title":"Ramble On (1999 Star System Mix)"
}
]
}
}
I'm not sure why the code isn't performing as expected. 我不确定为什么代码未按预期执行。
You are accessing wrongly the data from $.getJSON
You need to get response first: 您错误地访问了$.getJSON
的数据,您需要首先获取响应 :
data.response['songs'] data.response [ '歌曲']
$(document).ready(function() {
var key = '*****************'
var getMusic = function() {
$.getJSON('http://developer.echonest.com/api/v4/song/search?api_key=' + key + '&artist=led+zeppelin', function(data) {
$('.songs').append('<li>success</li>');
data.response['songs'].forEach(function(d) {
$('.songs').append('<li>' + d['title'] + '</li>');
});
});
};
$('.click').click(getMusic);
});
Notice that data
is the root JSON object, which has a response
property. 请注意, data
是JSON根对象,具有response
属性。 songs
is in the response
property, so in order to access it, you have to access data.response.songs
songs
位于response
属性中,因此要访问它,您必须访问data.response.songs
The correct code would be: 正确的代码是:
data.response.songs.forEach(function (song) {
$('.songs').append('<li>' + song.title + '</li>');
});
According to @Pointy's comment, it seems that you should use JSONP due to security reasons (possibly because of cross domain issues). 根据@Pointy的评论,似乎出于安全原因(可能是由于跨域问题),您应该使用JSONP 。
In order to use JSONP, you must provide a callback function appending &callback=?
为了使用JSONP,您必须提供一个附加&callback=?
的回调函数&callback=?
to the end of your service endpoint. 到服务端点的末端。 (jQuery will send the appropiate callback
value when sendng the request) (当发送请求时,jQuery将发送适当的callback
值)
// Note the trailing "callback=?"
$.getJSON('http://developer.echonest.com/api/v4/song/search?api_key=' + key + '&artist=led+zeppelin&callback=?')
.done(function (data) {
$('.songs').append('<li>success</li>');
data.response.songs.forEach(function (song) {
$('.songs').append('<li>' + song.title + '</li>');
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.