Internet Explorer 9 + Leaflet

This forum deals with any kind of web based client technology, whether it is the well known java script based Ajax servlet or the upcoming approaches such as Leaflet, OpenLayers and so on.
Post Reply
filipp
Posts: 3
Joined: Thu Sep 10, 2015 8:36 am

Internet Explorer 9 + Leaflet

Post by filipp »

Hi all.
Recently we had an issue with Internet Explorer 9 + webclient Leaflet and I would like to share a solution how we solved it.

We have a feature that displays a calculated route on the map which uses a Leaflet add-on that accesses PTV xMap.
There is a constant issue that we are experiencing with Internet Explorer 9, which is one of the browsers that our software should support.
When displaying a route on the map, map is not fully loaded. This means that there are some parts of the map which are visible and some are displayed as grey areas. Please see the screenshot.
map.png
When taking a look at the Network tab in the browser developer tools, some requests where failing (Aborted).

The problem had to do with IE timing out the request even though data was being transmitted.
It is a known issue( http://cypressnorth.com/programming/int ... sts-fixed/ ) and there is a solution and a workaround.
Sending a code snippet how we solved it in xmap-client.js. Modifications are on the lines 11,12 and 31,32,33.

Code: Select all

function sendXDomainRequest(path, request, callbackHandler, timeout) {
        if (typeof callbackHandler !== "function") {
            throw new Error("This browser does not support CORS with synchroneous requests.");
        }
        if (activeRequestCount >= activeRequestLimit) {
            requestQueue.push({ path: path, request: request, callbackHandler: callbackHandler, timeout: timeout });
            return null;
        }
        var xhr = new window.XDomainRequest();
        xhr.open("POST", requestURL + path);
        xhr.onprogress = function(){ };
        xhr.ontimeout = function () { };
        xhr.onload = function() {
            var responseObject = xhr.responseText && JSON.parse(xhr.responseText);
            callbackHandler(responseObject, null, xhr);
            responseArrived();
        };
        xhr.onerror = function() {
            var responseObject = xhr.responseText && JSON.parse(xhr.responseText);
            callbackHandler(null, responseObject, xhr);
            responseArrived();
        };
        if (timeout) {
            xhr.timeout = timeout;
            xhr.ontimeout = function() {
                callbackHandler(null, null, xhr);
                responseArrived();
            };
        }

        setTimeout(function(){
            xhr.send(JSON.stringify(request));
        }, 0);

        activeRequestCount++;
        return xhr;
 }

Best regards,
Filipp
Joost
Posts: 307
Joined: Fri Apr 25, 2014 1:46 pm

Re: Internet Explorer 9 + Leaflet

Post by Joost »

Hello Filipp,

I just made a customer happy with your post. Thnx for sharing your experiences.

Joost
Post Reply