How to read JSON in order to get the last video from YouTube
I'd like to extract the last video (only video), with title, description, etc.
I am using JSON Data API from YouTube Data API and using the Video Upload By User Feed in order to get the data.
I got from youtube a JSON (object?) about my Youtube's space and tried to read the JSON text, but its a suicide.
My code is :
<div id="ytContent"></div>
<script type="text/javascript">
function showMyVid开发者_JAVA百科eos(data) {
var feed = data.feed;
var entries = feed.entry || [];
for (var i = 0; i < entries.length; i++) {
var entry = entries[i];
var title = entry.title.$t;
$('#ytContent').append(title + "<br />");
}
}
</script>
<script type="text/javascript" src="http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads?alt=json-in-script&format=5&callback=showMyVideos"></script>
but if I try to do :
var p = eval("(" + data + ")");
alert(p);
I can't get a right parser. Why? How can I parse my JSON? I just need to understand which field I can use in order for me to get the last video from the feed. Also, hints/tips on getting the last video will also be helpful.
Thanks
You don't need to parse the data, it is already parsed.
The url inside your script
tags gets rendered into a function call, passing the data object as a parameter: showMyVideos({ /* data object */ });
.
Your problem is that you are trying to access the entry
field in the data you are receiving (var entries = feed.entry || []
), but there is no such field in data.feed
:
var data = {
"version": "1.0",
"encoding": "UTF-8",
"feed": {
"xmlns": "http://www.w3.org/2005/Atom",
"xmlns$openSearch": "http://a9.com/-/spec/opensearchrss/1.0/",
"id": {
"$t": "http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads"
},
"updated": {
"$t": "2011-09-06T08:05:27.303Z"
},
"category": [
{
"scheme": "http://schemas.google.com/g/2005#kind",
"term": "http://gdata.youtube.com/schemas/2007#video"
}
],
"title": {
"$t": "Uploads by MYUSERNAME",
"type": "text"
},
"logo": {
"$t": "http://www.youtube.com/img/pic_youtubelogo_123x63.gif"
},
"link": [
{
"rel": "related",
"type": "application/atom+xml",
"href": "http://gdata.youtube.com/feeds/users/myusername"
},
{
"rel": "alternate",
"type": "text/html",
"href": "http://www.youtube.com/profile_videos?user=MYUSERNAME"
},
{
"rel": "http://schemas.google.com/g/2005#feed",
"type": "application/atom+xml",
"href": "http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads"
},
{
"rel": "http://schemas.google.com/g/2005#batch",
"type": "application/atom+xml",
"href": "http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads/batch"
},
{
"rel": "self",
"type": "application/atom+xml",
"href": "http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads?alt=json-in-script&start-index=1&max-results=25&format=5"
}
],
"author": [
{
"name": {
"$t": "MYUSERNAME"
},
"uri": {
"$t": "http://gdata.youtube.com/feeds/users/myusername"
}
}
],
"generator": {
"$t": "YouTube data API",
"version": "2.1",
"uri": "http://gdata.youtube.com/"
},
"openSearch$totalResults": {
"$t": 0
},
"openSearch$startIndex": {
"$t": 1
},
"openSearch$itemsPerPage": {
"$t": 25
}
}
}
When showMyVideos is called, data
is already parsed. You don't need to parse it.
You don't get JSON! You get JavaScript! If you execute it using eval(),the data is automatically passed to your showMyVideos function. You don't have to parse anything ;) The data is already parsed, its an object, not a string.
Based on the question, I am assuming you want to get the last video and show it as video player. In order to show the last video, the possible steps are:
- Include the script for the player itself
<script type="text/javascript" src="http://swfobject.googlecode.com/svn/trunk/swfobject/swfobject.js"></script>
- Create your callback function. Basically what Google does is getting the JSON, parse it and call your callback function that you specified in
callback
parameter in your http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads?alt=json-in-script&format=5&callback=showMyVideos. In your callback you would want to show the video player for the last video. Something like:
// function to load your video
function loadVideo(playerUrl, autoplay) {
swfobject.embedSWF(
playerUrl + '&rel=1&border=0&fs=1&autoplay=' +
(autoplay?1:0), 'player', '290', '250', '9.0.0', false,
false, {allowfullscreen: 'true'});
}
// this is your callback function, Google call this function after parsing the JSON
// and passing it as data
function showMyVideos(data) {
var feed = data.feed;
var entries = feed.entry || [];
if (entries.length > 0) {
// show the video for the last entry
loadVideo(entries[entries.length-1].media$group.media$content[0].url, false);
}
}
Next you define somewhere where you want to put your video
<div id="playerContainer" style="width: 20em; height: 180px; float: left;"> <object id="player"></object> </div>
Finally call the script that will invoke your callback. This should be the same as your code in the question
<script type="text/javascript" src="http://gdata.youtube.com/feeds/users/MYUSERNAME/uploads?alt=json-in-script&format=5&callback=showMyVideos"></script>
精彩评论