Get YouTube video JSON Data using JQuery and Ajax
July 28, 2010 6 Comments
Earlier I’ve written an article on how t get Youtube data using JSON and it was a blast, but i had a litlle cosmetic drawback. You had to put script tags in your markup. It works but it’s not pretty (c: . One of the easiest ways to load JSON data onto our website is to use the $.ajax(), which is a very useful JQuery method. Her’s my way of doing it.
$.ajax({
type: "GET",
url: "http://gdata.youtube.com/feeds/users/[USERNAME]/uploads?alt=json-in-script&format=5",//generateJSonPlayListCallBackUrl(),
cache: false,
dataType:'jsonp',
success: function(data){
showMyVideos(data);
}
});
I’ve taken the showMyVideos() from Google’s Json documentation article it’ will display a list of video titles from a given Youtube users Chanel. To use this code snippet just replace [USERNAME] with a Youtube user name, and put inside a JS file (c: Take notice of dataType:’jsonp’, thats the important bit. This allows us to retrieve youtube data back to our domain (c:
well thats it for to day,.. stay frosty people,..
Maanehunden 
Hello, I love this code, but question please. I do not know jQuery. Do you know how to do it with Dojo. I keep getting a 405 error
thanks
thankz,.. (c: glad you like it,.. I’ve not played with Dojo jet .. )c: but if i can take a look at your code,.. parhaps i can spot an error.
Thanks, This is what I have. Both dont work. Same error.. a 405.
function goget() {
dojo.xhrGet( {
url: “http://gdata.youtube.com/feeds/api/videos/21OH0wlkfbc?v=2&alt=json-in-script&callback=youtubeFetchDataCallback”,
timeout: 4000,
handleAs: “json”,
load: function(response, ioArgs) {
alert(‘worked’);
return response;
},
error: function(response, ioArgs) {
alert(response.toString());
console.log(response, ioArgs);
return response;
},
});
}
function gopost() {
dojo.xhrPost({
url: “http://gdata.youtube.com/feeds/api/videos/21OH0wlkfbc”,
timeout: 4000,
handleAs: “jsonc”,
load: function(response, ioArgs) {
alert(‘worked’);
return response;
},
error: function(response, ioArgs) {
alert(response.toString());
console.log(response, ioArgs);
return response;
},
content: {
v: ‘2’,
alt: ‘json-in-script’,
callback: ‘youtubeFeedCallback’,
},
});
}
Hello, I love this code, but question please. I do not know jQuery. Do you know how to do it with Dojo. I keep getting a 405 error
I did a slightly different implementation of the youtube json api http://genesisfont.com/jsonvid/ , still working on it
Great stuff man,. nice to hear you could use some of my babbling (c: keep up the god work