0

Any idea why this does not work in IE9 but does in Chrome and Firefox?

        $.get("http://nominatim.openstreetmap.org/search", { format: "json", q: val, polygon: 0, addressdetails: 1 }) 
        .done(function(results) {   
            if (!results) return;
            // do something
        });

I know IE8 wont support it but i thought 9 would?

Update:

New code

$.ajax({
        type: 'GET',
        url: "http://nominatim.openstreetmap.org/reverse",
        data: { format: "json", lat: lat, lon: lng, zoom: 18, addressdetails: 1 },
        error: function(xhr, status, error) {
            myTable.fnUpdate("Not supported by browser", aPos[0], 4);
        },
        success: function(data){
            myTable.fnUpdate(data.display_name, aPos[0], 4);
        }
});

At least with this i can show "Not supported by browser" rather than nothing happening, are there no tricks to make it work in IE9?

Update 2: This seems to work in FF, Chrome and IE9. http://jsfiddle.net/BXhkm/4/ But when i add the same code to my app the first request is successfull, then i get Error: data was not called.

Vince Lowe
  • 3,521
  • 7
  • 36
  • 63
  • 2
    How does it not work? As in what is its behaviour as opposed to the expected behaviour. – Musa Jun 19 '13 at 16:18
  • You do a cross domain request. This does not work with all browsers, so you need to use `jonp` for your request. This should be supported by openstreet maps. – t.niese Jun 19 '13 at 16:21
  • please create jsfiddle of your problem.... – bastos.sergio Jun 19 '13 at 16:30
  • I think this is my problem, json not supported cross domain - http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx – Vince Lowe Jun 19 '13 at 16:33
  • @Musa It doesn't retrieve any results. `$.get` has no error handler but i suspect its security. I will update the code to $.ajax to confirm. – Vince Lowe Jun 19 '13 at 16:38
  • jQuery does not support CORS requests in IE<10, and looking at your code, it appears to be making a CORS request. – Kevin B Jun 19 '13 at 17:03
  • Can't you use JSONP instead of plain JSON (eliminating the need for CORS support)? – m90 Jun 20 '13 at 08:31

1 Answers1

1

To solve cross domain issues, you need to read the documentations of the Server API and the one of jQuery.

If the browser/framework does not support cross domain requests via GET or POST you need to fallback to JSONP requests.

Wiki docs of Openstreetmap Nominatim:

json_callback=<string> Wrap json output in a callback function (JSONP)

This tells you that the parameter that defines the callback function is json_callback

Now you look at the docs of your framework:

jQuery.getJSON section JSONP

If the URL includes the string "callback=?" (or similar, as defined by the server-side API), the request is treated as JSONP instead. See the discussion of the jsonp data type in $.ajax() for more details.

This tells you if you include a paramter in your request url and that has the value ?. This ? is replaced by the callback method for the JSONP request.

Out of this two informations you create this query:

$.getJSON("http://nominatim.openstreetmap.org/reverse?json_callback=?", 
         { format: "json", lat: lat, lon: lng, zoom: 18, addressdetails: 1 },
         function(data) {
            console.log("success");
         });

Instead of getJSON you can for sure use ajax the important part is that you do a jsonp request.

EDIT The first ? marks the beginning of the parameter list, the second ? is the placeholder for the jsonp callback. http://nominatim.openstreetmap.org/reverse?json_callback=?

t.niese
  • 39,256
  • 9
  • 74
  • 101
  • 1
    @VinceLowe remove the `console.log("success");` seems like IE 9 does not like it if the dev tools are closed (at least the IE 9 version i have running here). – t.niese Jun 20 '13 at 13:39
  • 1
    @VinceLowe to you **Update 2** you use the `jsonpCallback` option the wrong way. You should change it this way: http://jsfiddle.net/BXhkm/5/ . An important note: check my changes where i added `req`. Ajax request are async. So if your interval time is smaller then the time the request needs to be delivered, you do more then the 4 request. if Openstreetmap or your connection is slow, this could be a huge number - here it was about 100 requests instead just 4 because osm responded slow ;) – t.niese Jun 20 '13 at 14:23
  • you might add jQuery.support.cors = true; as well – JasonBK May 19 '15 at 18:54
  • @JasonBK I don't know if `jQuery.support.cors` exists, but if it exists then you should not set it yourself, because jQuery will set properties in `jQuery.support` depending on if they are supported by the browser or not. Setting it to `true` won't activate cors. – t.niese May 20 '15 at 12:05
  • according to this thread, using this statement "...tells jQuery that you're in an environment where Cross-Domain XHR requests are possible."...although I have not added Modernizr to the particular app, which JQuery docs recommends for feature detection...in any case, my app's web service calls work with this line, and do not work without it, in IE9. more here: http://stackoverflow.com/questions/7852225/is-it-safe-to-use-support-cors-true-in-jquery – JasonBK May 20 '15 at 12:40