Retrieving JSON from remote domain, jQuery

Question

I am trying to retrieve JSON formatted data from a remote domain (Zencoder video encoding API) in a jQuery script. When the script runs, it returns code 200 but Firebug shows an error (bold red highlight, circle with an X) on the address, and the response is empty.

Here is the jQuery script relating to this:

var checkStatus = function(jobID) {
        var url = 'https://app.zencoder.com/api/v2/jobs/' + jobID + '/progress.json?api_key=asdad3332d';
        $.getJSON(url, function(data) {
            if (data.state == 'processing') {
                    //Do things to indicate job is still going
                    //Repeat this function to check status again
                    setTimeout(function() {
                        checkStatus(jobID);
                    }, 6000);
                } else if (data.state == 'finished') {
                    //Do some stuff
                } else if (data.state == 'failed') {
                    //Show errors, do other stuff
                }
            });
     };

And here is an example of JSON returned.

{"outputs":[{"id":18492554,"state":"finished"},{"id":18492553,"state":"finished"},{"id":18492555,"state":"finished"}],"input":{"id":12437680,"state":"finished"},"state":"finished"}

Finally, here are the response headers returned by Firebug:

Response Headers
Cache-Control   private, max-age=0, must-revalidate
Connection  close
Content-Length  174
Content-Type    application/json; charset=utf-8
Date    Thu, 09 Feb 2012 16:06:13 GMT
Etag    "48f2d50a838e0e1e433f7c0ba197e787"
Server  ZenServer 0.1.0
X-Zencoder-Rate-Remaining   4999

Any help would be appreciated here. Scratching my head on this one

DOCUMENTATION Here is the API documentation referring to obtaining the job progress, which is what I am trying to do.. https://app.zencoder.com/docs/api/jobs/progress

Well, you cannot make Ajax requests to external domains, it violates the same-origin policy. — Felix Kling
– Felix Kling, Commented Feb 9, 2012 at 16:14

Jonathan M · Accepted Answer · 2012-02-09 16:30:48Z

1

You'll need to use jsonp for cross-domain requests, and the server will need to be able to accept jsonp requests and answer appropriately.

$.ajax({
    url: 'https://app.zencoder.com/api/v2/jobs/1234/progress.js?api_key=asdf1234',
    dataType: 'jsonp',
    success: function(data){// your code here
    }
});

jQuery will append the callback=blah parm automatically. See here the dataType section here: http://api.jquery.com/jQuery.ajax/

The data parm in the success function will contain the object (not just a JSON string, but the object represented by the JSON string).

edited Feb 9, 2012 at 16:30

answered Feb 9, 2012 at 16:16

Jonathan M

17.5k9 gold badges61 silver badges95 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

NightMICU Over a year ago

Their API documentation does mention JSONP, stating that you need to use the following URL format: https://app.zencoder.com/api/v2/jobs/1234/progress.js?api_key=asdf1234&callback=asdf, where the callback is optional. I tried this URL instead and had the same result - Code 200, error indication, no response. Do I need to change the code or just the URL (essentially, .js instead of .json)?

Jonathan M Over a year ago

The callback=asdf means they accept jsonp requests. Just use the format in my answer and jQuery will take care of it.

osahyoun · Accepted Answer · 2012-02-09 16:16:17Z

0

Can you append callback=? to the URL query? This should work, assuming the server supports JSONP.

answered Feb 9, 2012 at 16:16

osahyoun

5,2312 gold badges19 silver badges15 bronze badges

Collectives™ on Stack Overflow

Retrieving JSON from remote domain, jQuery

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related