jQuery.getJSON causes "Uncaught SyntaxError: Unexpected token :" for youtube oembed

Here is what I'm trying to do:

$.getJSON('http://www.y开发者_运维知识库outube.com/oembed?url=http://www.youtube.com/watch%3Fv%3DB-m6JDYRFvk&callback=?', 
           function(data) { console.log(data) });

When curling that URL I get this response:

{
    "provider_url": "http:\/\/www.youtube.com\/",
    "title": "Coder Girl",
    "html": "\u003cobject width=\"425\" height=\"344\"\u003e\u003cparam name=\"movie\" value=\"http:\/\/www.youtube.com\/v\/B-m6JDYRFvk?version=3\"\u003e\u003c\/param\u003e\u003cparam name=\"allowFullScreen\" value=\"true\"\u003e\u003c\/param\u003e\u003cparam name=\"allowscriptaccess\" value=\"always\"\u003e\u003c\/param\u003e\u003cembed src=\"http:\/\/www.youtube.com\/v\/B-m6JDYRFvk?version=3\" type=\"application\/x-shockwave-flash\" width=\"425\" height=\"344\" allowscriptaccess=\"always\" allowfullscreen=\"true\"\u003e\u003c\/embed\u003e\u003c\/object\u003e",
    "author_name": "dalechase",
    "height": 344,
    "thumbnail_width": 480,
    "width": 425,
    "version": "1.0",
    "author_url": "http:\/\/www.youtube.com\/user\/dalechase",
    "provider_name": "YouTube",
    "thumbnail_url": "http:\/\/i3.ytimg.com\/vi\/B-m6JDYRFvk\/hqdefault.jpg",
    "type": "video",
    "thumbnail_height": 360
}

But when I try to execute the above code, I get an Uncaught SyntaxError: Unexpected token : (Chrome). It looks like the problem might have something to do with the escaping of the forward slashes, or maybe that jQuery is sending a JSONP request, but the response is pure JSON.

Has anyone else run into this problem?

---

Youtube (as of the time of this answer) oembed doesn't support JSONP with their requests, so what you're getting back is correct...but it's not what you need. What you need for JSONP calls would look like this:

functionName({
    "provider_url": "http:\/\/www.youtube.com\/",
    "title": "Coder Girl",
    "html": "\u003cobject width=\"425\" height=\"344\"\u003e\u003cparam name=\"movie\" value=\"http:\/\/www.youtube.com\/v\/B-m6JDYRFvk?version=3\"\u003e\u003c\/param\u003e\u003cparam name=\"allowFullScreen\" value=\"true\"\u003e\u003c\/param\u003e\u003cparam name=\"allowscriptaccess\" value=\"always\"\u003e\u003c\/param\u003e\u003cembed src=\"http:\/\/www.youtube.com\/v\/B-m6JDYRFvk?version=3\" type=\"application\/x-shockwave-flash\" width=\"425\" height=\"344\" allowscriptaccess=\"always\" allowfullscreen=\"true\"\u003e\u003c\/embed\u003e\u003c\/object\u003e",
    "author_name": "dalechase",
    "height": 344,
    "thumbnail_width": 480,
    "width": 425,
    "version": "1.0",
    "author_url": "http:\/\/www.youtube.com\/user\/dalechase",
    "provider_name": "YouTube",
    "thumbnail_url": "http:\/\/i3.ytimg.com\/vi\/B-m6JDYRFvk\/hqdefault.jpg",
    "type": "video",
    "thumbnail_height": 360
});

...since what comes back currently is not valid JavaScript (by itself, and that's what it is), and that's how JSONP works, the response actually needs to be executable JavaScript.

You can get the same error by just plopping that code straight in your page in a <script> block (see a demo here).

---

I'm not sure exactly what you're trying to do, but if you're just after the embedding piece, I recommend a plugin like jQuery-oembed to do that. If you're after the data...you'll need something on your server to process the JSON, then get the data from your server after that.

---

You don't need to use JSONP anymore with jQuery as of version 1.5. Try $.ajax() and set crossDomain:true and remove all your ?callback wrappers and see if it works. It's a much more reliable method and the syntax is much cleaner.

---

Perhaps a better alternative would be to replace your cross domain call with a call to a web service running on your own server that runs the call for you. My guess is Chrome is blocking the cross domain request.

---

Stringify the result works for me.

$.getJSON('your_url_here', function(data) {
    console.log(data);  //"Object { Json content }"
    var jsonString = JSON.stringify(data);  //"{ Json content }", the "Object" literal is removed.
    var parsed = JSON.parse(jsonString); //Parse should work now.
});