$.getJSON 尽管成功但不返回任何东西
$.getJSON not returning anything despite success
我对整个 jQuery 事情比较陌生,如果这是一件非常明显的事情,我们深表歉意。
我的基本问题是,尽管 JSON 文件有效,但 .getJSON() 函数中的 URL 没有返回任何内容。
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);
});
所以 "success" 被附加到列表中,但没有其他内容。 Chrome 中的调试控制台给我以下错误:Uncaught TypeError: Cannot read property 'forEach' of undefined
我假设这意味着 URL 没有向函数传递任何内容。但是 URL 是有效的。如果我只是将其输入 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)"
}
]
}
}
我不确定为什么代码没有按预期执行。
注意 data
是根 JSON 对象,它有一个 response
属性。 songs
在 response
属性 中,所以要访问它,您必须访问 data.response.songs
正确的代码是:
data.response.songs.forEach(function (song) {
$('.songs').append('<li>' + song.title + '</li>');
});
如果一定要用JSONP
根据@Pointy 的评论,出于安全原因(可能是跨域问题),您似乎应该使用 JSONP。
为了使用 JSONP,您必须提供一个回调函数,将 &callback=?
附加到您的服务端点的末尾。 (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>');
});
});
您错误地访问了来自 $.getJSON
的数据
您需要先获得响应:
data.response['songs']
$(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);
});
我对整个 jQuery 事情比较陌生,如果这是一件非常明显的事情,我们深表歉意。
我的基本问题是,尽管 JSON 文件有效,但 .getJSON() 函数中的 URL 没有返回任何内容。
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);
});
所以 "success" 被附加到列表中,但没有其他内容。 Chrome 中的调试控制台给我以下错误:Uncaught TypeError: Cannot read property 'forEach' of undefined
我假设这意味着 URL 没有向函数传递任何内容。但是 URL 是有效的。如果我只是将其输入 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)"
}
]
}
}
我不确定为什么代码没有按预期执行。
注意 data
是根 JSON 对象,它有一个 response
属性。 songs
在 response
属性 中,所以要访问它,您必须访问 data.response.songs
正确的代码是:
data.response.songs.forEach(function (song) {
$('.songs').append('<li>' + song.title + '</li>');
});
如果一定要用JSONP
根据@Pointy 的评论,出于安全原因(可能是跨域问题),您似乎应该使用 JSONP。
为了使用 JSONP,您必须提供一个回调函数,将 &callback=?
附加到您的服务端点的末尾。 (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>');
});
});
您错误地访问了来自 $.getJSON
的数据
您需要先获得响应:
data.response['songs']
$(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);
});