Spotify API: Retrieving song/artist/album information using jQuery/ajax
I've done some searching and I've found some stuff somewhat similar, but I'm still struggling a little with getting my head around the way in which this works.
I'm trying to send a request to search for an artist and track to the Spotify API using jQuery and then retrieve the data from the json I'm receiving back.
Here's my code:
$.ajax({
url: "https://api.spotify.com/v1/search?q=" + song + "%20" + artist + "&type=track&limit=1",
dataType: "json",
success: function(data) {
//data downloaded so we call parseJSON function
//and pass downloaded data
var json = $.parseJSON(data);
//now json variable contains data in json format
//let's display a few items
var trackName = json.items.name;
},
error: function() {
console.log("Error retrieving spotify API");
}
});
In the console, it's showing this:
XHR finished loading: GET "https://api.spotify.com/v1/search?q=Ride%20Twenty%20One%20Pilots&type=track&limit=1".
This tells me the request is sending correctly, the json spotify responds with is:
{
"tracks" : {
"href" : "https://api.spotify.com/v1/search?query=Ride+Twenty+One+Pilots&offset=0&limit=1&type=track",
"items" : [ {
"album" : {
"album_type" : "album",
"artists" : [ {
"external_urls" : {
"spotify" : "https://open.spotify.com/artist/3YQKmKGau1PzlVlkL1iodx"
},
"href" : "https://api.spotify.com/v1/artists/3YQKmKGau1PzlVlkL1iodx",
"id" : "3YQKmKGau1PzlVlkL1iodx",
"name" : "Twenty One Pilots",
"type" : "artist",
"uri" : "spotify:artist:3YQKmKGau1PzlVlkL1iodx"
} ],
"available_markets" : [ "AD", "AR", "AT", "AU", "BE", "BG", "BO", "BR", "CA", "CH", "CL", "CO", "CR", "CY", "CZ", "DE", "DK", "DO", "EC", "EE", "ES", "FI", "FR", "GB", "GR", "GT", "HK", "HN", "HU", "ID", "IE", "IS", "IT", "JP", "LT", "LU", "LV", "MC", "MT", "MX", "MY", "NI", "NL", "NO", "NZ", "PA", "PE", "PH", "PL", "PT", "PY", "SE", "SG", "SK", "SV", "TR", "TW", "US", "UY" ],
"external_urls" : {
"spotify" : "https://open.spotify.com/album/3cQO7jp5S9qLBoIVtbkSM1"
},
"href" : "https://api.spotify.com/v1/albums/3cQO7jp5S9qLBoIVtbkSM1",
"id" : "3cQO7jp5S9qLBoIVtbkSM1",
"images" : [ {
"height" : 640,
"url" : "https://i.scdn.co/image/52fc1b3b08807194b87cd7e4fd68f5118d991e44",
"width" : 640
}, {
"height" : 300,
"url" : "https://i.scdn.co/image/cd5eb6933cca9421578e3badfed816f046f3a86e",
"width" : 300
}, {
"height" : 64,
"url" : "https://i.scdn.co/image/7f143f49de9521bc762c68cd29ff251f94244c28",
"width" : 64
} ],
"name" : "Blurryface",
"type" : "album",
"uri" : "spotify:album:3cQO7jp5S9qLBoIVtbkSM1"
},
"artists" : [ {
"external_urls" : {
"spotify" : "https://open.spotify.com/artist/3YQKmKGau1PzlVlkL1iodx"
},
"href" : "https://api.spotify.com/v1/artists/3YQKmKGau1PzlVlkL1iodx",
"id" : "3YQKmKGau1PzlVlkL1iodx",
"name" : "Twenty One Pilots",
"type" : "artist",
"uri" : "spotify:artist:3YQKmKGau1PzlVlkL1iodx"
} ],
"available_markets" : [ "AD", "AR", "AT", "AU", "BE", "BG", "BO", "BR", "CA", "CH", "CL", "CO", "CR", "CY", "CZ", "DE", "DK", "DO", "EC", "EE", "ES", "FI", "FR", "GB", "GR", "GT", "HK", "HN", "HU", "ID", "IE", "IS", "IT", "JP", "LT", "LU", "LV", "MC", "MT", "MX", "MY", "NI", "NL", "NO", "NZ", "PA", "PE", "PH", "PL", "PT", "PY", "SE", "SG", "SK", "SV", "TR", "TW", "US", "UY" ],
"disc_number" : 1,
"duration_ms" : 214506,
"explicit" : false,
"external_ids" : {
"isrc" : "USAT21500598"
},
"external_urls" : {
"spotify" : "https://open.spotify.com/track/2Z8WuEywRWYTKe1NybPQEW"
},
"href" : "https://api.spotify.com/v1/tracks/2Z8WuEywRWYTKe1NybPQEW",
"id" : "2Z8WuEywRWYTKe1NybPQEW",
"name" : "Ride",
"popularity" : 91,
"preview_url" : "https://p.scdn.co/mp3-preview/26fc2318d6ebad09ae7aed7adfce2b28413cea7e",
"track_number" : 3,
"type" : "track",
"uri" : "spotify:track:2Z8WuEywRWYTKe1NybPQEW"
} ],
"limit" : 1,
"next" : "https://api.spotify.com/v1/search?query=Ride+Twenty+One+Pilots&offset=1&limit=1&type=track",
"offset" : 0,
"previous" : null,
"total" : 20
}
}
I'm trying to retrieve the following information and save them into the variables: The song name, the artist, the album cover & the link to the album on spotify.
I've tried using
var trackName = json.tracks.items.name;
But the console has this error:
(index):465 Uncaught TypeError: Cannot read property 'name' of undefined
When I look into where this is, it's where I am trying to set the variables in the code.
If anyone could point me in the right direction, or help me at all with this that'd be greatly appreciated!
Thank you
尝试使用“data.tracks.items.name”，将工作。
链接地址: http://www.djcxy.com/p/55578.html