Ajax request works in safari, but not in Firefox (Vimeo oembed)
I'm trying to get a vimeo embed code via the oembed API (json).
It works fine in safari, but in Firefox, it seems that the json returned is not interpreted correctly, as I get a null value instead of the javascript object (in the success method).
i'd give a link to a jsfiddle example, but the sample doesn't work there, some error about an unallowed origin..
So here is the code:
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
<script type='text/javascript'>
//<![CDATA[
$(window).load(function(){
$.ajax({
url: "http://vimeo.com/api/oembed.json?&format=json&url=http%3A//vimeo.com/2197639",
dataType: "json",
success: function(data) {
$('#output').html(JSON.stringify(data));
},
error: function(errorSender, errorMsg) {
console.log(errorSender);
console.log(errorMsg);
$('#output').html(errorSender + ' ' + errorMsg);
}
});
});
//]]>
</script>
Any ides what could be wrong? Is it something with the json?
Sample json is:
{"type":"video","version":"1.0","provider_name":"Vimeo","provider_url":"http:\/\/vimeo.com\/","title":"Early Morning Qena","author_name":"Oliver Wilkins","author_url":"http:\/\/vimeo.com\/offshoot","is_plus":"1","html":"<iframe src=\"http:\/\/player.vimeo.com\/video\/2197639\" width=\"1280\" height=\"720\" frameborder=\"0\" webkitAllowFullScreen allowFullScreen><\/iframe>","width":1280,"height":720,"duration":229,"description":"Early morning in Quft, near Qena. Shot开发者_JAVA百科 with EX1 and Letus Extreme 35mm DOF adaptor.\n\nwww.offshoot.tv\n","thumbnail_url":"http:\/\/b.vimeocdn.com\/ts\/271\/854\/27185484_640.jpg","thumbnail_width":640,"thumbnail_height":360,"video_id":2197639}
You need to use JSONP because you are trying to perform a cross domain AJAX call. It looks that vimeo supports it. You just need to specify a callback by modifying your url (notice the callback=?
parameter that I appended at the end and the format=jsonp
):
$.ajax({
url: "http://vimeo.com/api/oembed.json?format=jsonp&url=http%3A%2F%2Fvimeo.com%2F2197639&callback=?",
dataType: "jsonp",
success: function(data) {
$('#output').text(JSON.stringify(data));
},
error: function(errorSender, errorMsg) {
$('#output').text(errorSender + ' ' + errorMsg);
}
});
and here's a live demo.
精彩评论