Get JSON(P) from other site

Question

I am trying to get data with Ajax. Data is json. I use jquery and angular.

But result is undefined or error.

Here is my jquery code:

$(document).ready(function() {
      var url = "http://market.dota2.net/history/json/";

      $.ajax({
           type: 'GET',
            url: url,
            async: false,
            contentType: "application/json",
            dataType: 'jsonp',
            success: function(data) {
              console.log(data);
            }
        });
    });

In Angular i am usin jsonp method. Whats wrong ?

By the way, in pure Java i can get data from this url...

You do understand the difference between JSON and [JSONP](https://en.wikipedia.org/wiki/JSONP), right? The URL in your sample does **not** return JSONP. — Robby Cornelissen, Jul 31 '15 at 09:28
`contentType: "application/json",` — You're making a GET request, you have no request body to describe the content-type of. — Quentin, Jul 31 '15 at 09:32

T.J. Crowder · Answer 1 · 2015-07-31T09:37:06.027

Whats wrong?

You're trying to call an endpoint that provides JSON as though it provided JSONP. That won't work; they are different (though related) formats.

Example JSON:

{"foo":"bar"}

Example JSONP:

callback({"foo":"bar"})

Note the difference: JSONP is actually a JavaScript function call, wrapped around the JSON.

If the API supports JSONP, call an endpoint that supports it.

If not, you can't query it directly unless the provider supports Cross-Origin Resource Sharing and shares with your origin, because of the Same Origin Policy that applies to ajax calls.

By the way, in pure Java i can get data from this url...

Because the Java code is not running in a context that is controlled by the SOP, and so can get the data from that endpoint (as JSON) and use it. This is also the same reason that just posting that URL into a browser address bar lets us see the data. But ajax calls are governed by tighter rules.

3pic · Answer 2 · 2015-07-31T09:40:20.953

If you expect json, dont use jsonp but json.

$(document).ready(function() {
      var url = "http://market.dota2.net/history/json/";

      $.ajax({
           type: 'GET',
            url: url,
            async: true, /* it fails with false */
            contentType: "application/json",
            dataType: 'json',/* <== here */
            success: function(data) {
              console.log(data);
            }
        });
    });

Are you using jsonp consciously ? Do you know what it is ? If not, use json. Or get informed about JSonP: https://en.wikipedia.org/wiki/JSONP

I tried on Safari:works.

On Chrome & FFox: does not work + Erreur "Cross Domain Origin"

XMLHttpRequest cannot load http://market.dota2.net/history/json/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

That means you cannot get JSon with your client/machine from the API server. So you should indeed use JSonP, but... you miss the callback or something in the API documentation.

Get JSON(P) from other site

2 Answers2