1. #11
    Sencha User charris's Avatar
    Join Date
    Sep 2010
    Location
    Brooklyn, NY
    Posts
    106
    Vote Rating
    13
    charris will become famous soon enough

      0  

    Default


    I'm not sure if this is relevant, but if you look at the source for Connection.request you'll see that it only tries to use a cross-domain request for IE 8+:
    Code:
    if ((options.cors === true || me.cors === true) && Ext.isIE && Ext.ieVersion >= 8) {    
        xhr = new XDomainRequest();
    } else {
        xhr = this.getXhrInstance();
    }

  2. #12
    Sencha User
    Join Date
    Nov 2011
    Location
    Toronto
    Posts
    105
    Vote Rating
    2
    basememara is on a distinguished road

      0  

    Default


    Thanks but I need this piece of code added for Ext.Loader.require:

    Code:
            /**
             * Load a script file, supports both asynchronous and synchronous approaches
             *
             * @param {String} url
             * @param {Function} onLoad
             * @param {Object} scope
             * @param {Boolean} synchronous
             * @private
             */
            loadScriptFile: function(url, onLoad, onError, scope, synchronous) {
                var me = this,
                    noCacheUrl = url + (this.getConfig('disableCaching') ? ('?' + this.getConfig('disableCachingParam') + '=' + Ext.Date.now()) : ''),
                    fileName = url.split('/').pop(),
                    isCrossOriginRestricted = false,
                    xhr, status, onScriptError;
    
                scope = scope || this;
    
                this.isLoading = true;
    
                if (!synchronous) {
                    onScriptError = function() {
                        onError.call(scope, "Failed loading '" + url + "', please verify that the file exists", synchronous);
                    };
    
                    if (!Ext.isReady && Ext.onDocumentReady) {
                        Ext.onDocumentReady(function() {
                            me.injectScriptElement(noCacheUrl, onLoad, onScriptError, scope);
                        });
                    }
                    else {
                        this.injectScriptElement(noCacheUrl, onLoad, onScriptError, scope);
                    }
                }
                else {
                    if (typeof XMLHttpRequest !== 'undefined') {
                        xhr = new XMLHttpRequest();
                    } else {
                        xhr = new ActiveXObject('Microsoft.XMLHTTP');
                    }
    
                    try {
                        xhr.open('GET', noCacheUrl, false);
                        xhr.send(null);
                    } catch (e) {
                        isCrossOriginRestricted = true;
                    }
    
                    status = (xhr.status === 1223) ? 204 : xhr.status;
    
                    if (!isCrossOriginRestricted) {
                        isCrossOriginRestricted = (status === 0);
                    }
    
                    if (isCrossOriginRestricted
                    //<if isNonBrowser>
                    && !isPhantomJS
                    //</if>
                    ) {
                        onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; It's likely that the file is either " +
                                           "being loaded from a different domain or from the local file system whereby cross origin " +
                                           "requests are not allowed due to security reasons. Use asynchronous loading with " +
                                           "Ext.require instead.", synchronous);
                    }
                    else if (status >= 200 && status < 300
                    //<if isNonBrowser>
                    || isPhantomJS
                    //</if>
                    ) {
                        // Firebug friendly, file names are still shown even though they're eval'ed code
                        new Function(xhr.responseText + "\n//@ sourceURL=" + fileName)();
    
                        onLoad.call(scope);
                    }
                    else {
                        onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; please " +
                                           "verify that the file exists. " +
                                           "XHR status code: " + status, synchronous);
                    }
    
                    // Prevent potential IE memory leak
                    xhr = null;
                }
            },

  3. #13
    Sencha User
    Join Date
    Nov 2011
    Location
    Toronto
    Posts
    105
    Vote Rating
    2
    basememara is on a distinguished road

      0  

    Default


    bump

    ...any chance we can get CORS enabled on Ext.Loader for the 4.1 release?

  4. #14
    Sencha User
    Join Date
    Nov 2011
    Location
    Toronto
    Posts
    105
    Vote Rating
    2
    basememara is on a distinguished road

      0  

    Default


    I tried overriding the Ext.Loader singleton class as below, but no luck. The responseText is coming back blank, but is populated too late in the lifecycle. I am missing something, but I am not sure where

    Code:
    //ENABLE CORS WORKAROUND FOR SCRIPT LOADER
    Ext.Loader.cors = true;
    Ext.Loader.loadScriptFile = function(url, onLoad, onError, scope, synchronous) {
        var me = this,
            noCacheUrl = url + (this.getConfig('disableCaching') ? ('?' + this.getConfig('disableCachingParam') + '=' + Ext.Date.now()) : ''),
            fileName = url.split('/').pop(),
            isCrossOriginRestricted = false,
            xhr, status, onScriptError;
    
    
        scope = scope || this;
    
        this.isLoading = true;
    
        if (!synchronous) {
            onScriptError = function() {
                onError.call(scope, "Failed loading '" + url + "', please verify that the file exists", synchronous);
            };
    
            if (!Ext.isReady && Ext.onDocumentReady) {
                Ext.onDocumentReady(function() {
                    me.injectScriptElement(noCacheUrl, onLoad, onScriptError, scope);
                });
            }
            else {
                this.injectScriptElement(noCacheUrl, onLoad, onScriptError, scope);
            }
        }
        else {
            //HANDLE CORS IN IE IF APPLICABLE
            if (this.cors == true && Ext.isIE && Ext.ieVersion >= 8) {    
                xhr = new XDomainRequest();
                xhr.onload = function() { 
                    console.log(this.responseText); 
                };
                xhr.onprogress = function() {};
                xhr.onerror = function() {};
                xhr.ontimeout = function() {};
                try {
                    xhr.open('GET', noCacheUrl);
                    xhr.send(null);
                    xhr.status = 200;
                } catch (e) {
                    isCrossOriginRestricted = true;
                }
            } else {
                if (typeof XMLHttpRequest !== 'undefined') {
                    xhr = new XMLHttpRequest();
                } else {
                    xhr = new ActiveXObject('Microsoft.XMLHTTP');
                }
                try {
                    xhr.open('GET', noCacheUrl, false);
                    xhr.send(null);
                } catch (e) {
                    isCrossOriginRestricted = true;
                }
            }
    
            status = (xhr.status === 1223) ? 204 : xhr.status;
    
            if (!isCrossOriginRestricted) {
                isCrossOriginRestricted = (status === 0);
            }
    
            if (isCrossOriginRestricted
            //<if isNonBrowser>
            && !isPhantomJS
            //</if>
            ) {
                onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; It's likely that the file is either " +
                                   "being loaded from a different domain or from the local file system whereby cross origin " +
                                   "requests are not allowed due to security reasons. Use asynchronous loading with " +
                                   "Ext.require instead.", synchronous);
            }
            else if (status >= 200 && status < 300
            //<if isNonBrowser>
            || isPhantomJS
            //</if>
            ) {
                // Firebug friendly, file names are still shown even though they're eval'ed code
                new Function(xhr.responseText + "\n//@ sourceURL=" + fileName)();
    
                onLoad.call(scope);
            }
            else {
                onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; please " +
                                   "verify that the file exists. " +
                                   "XHR status code: " + status, synchronous);
            }
    
            // Prevent potential IE memory leak
            xhr = null;
        }
    };
    For context, I am trying this so I can embed my Sencha app in remote websites. The remote websites need to do cross-domain requests to dynamically load my app's Javascript files.

  5. #15
    Sencha - Community Support Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,963
    Vote Rating
    10
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Default


    @basememara--

    Some important constraints to consider for your IE8+ use case:

    Synchronous requests are NOT supported with XDomainRequest.
    Protocols must match between domains ( http !== https ), means no access.
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  6. #16
    Sencha User
    Join Date
    Nov 2011
    Location
    Toronto
    Posts
    105
    Vote Rating
    2
    basememara is on a distinguished road

      0  

    Default


    @hendricd I think you are SPOT ON!

    I needed a synchronous call the way Ext.Loader.loadScriptFile was constructed. I even tried putting the logic for evaluating the remote script in the XDomainRequest's onload, but that fires much later. By the time that fires, the app is trying to make references to the needed classes already.

    Code:
            if (this.cors == true && Ext.isIE && Ext.ieVersion >= 8) {
                    xhr = new XDomainRequest();
                xhr.onload = function() { 
                    if (this.responseText != '') {
                        // Firebug friendly, file names are still shown even though they're eval'ed code
                        new Function(this.responseText + "\n//@ sourceURL=" + fileName)();
    
                        onLoad.call(scope);
                    }
                };
                xhr.onprogress = function() { };
                xhr.onerror = function() { };
                xhr.ontimeout = function() { };
                xhr.timeout = 5000;
                try {
                    xhr.open('GET', noCacheUrl);
                    xhr.send();
                } catch (e) {
                    onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; It's likely that the file is either " +
                                       "being loaded from a different domain or from the local file system whereby cross origin " +
                                       "requests are not allowed due to security reasons. Use asynchronous loading with " +
                                       "Ext.require instead.", synchronous);
                }
            } else {
                if (typeof XMLHttpRequest !== 'undefined') {
                    xhr = new XMLHttpRequest();
                } else {
                    xhr = new ActiveXObject('Microsoft.XMLHTTP');
                }
                try {
                    xhr.open('GET', noCacheUrl, false);
                    xhr.send(null);
                } catch (e) {
                    isCrossOriginRestricted = true;
                }
                
                status = (xhr.status === 1223) ? 204 : xhr.status;
    
                if (!isCrossOriginRestricted) {
                    isCrossOriginRestricted = (status === 0);
                }
    
                if (isCrossOriginRestricted
                //<if isNonBrowser>
                && !isPhantomJS
                //</if>
                ) {
                    onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; It's likely that the file is either " +
                                       "being loaded from a different domain or from the local file system whereby cross origin " +
                                       "requests are not allowed due to security reasons. Use asynchronous loading with " +
                                       "Ext.require instead.", synchronous);
                }
                else if (status >= 200 && status < 300
                //<if isNonBrowser>
                || isPhantomJS
                //</if>
                ) {
                    // Firebug friendly, file names are still shown even though they're eval'ed code
                    new Function(xhr.responseText + "\n//@ sourceURL=" + fileName)();
    
                    onLoad.call(scope);
                }
                else {
                    onError.call(this, "Failed loading synchronously via XHR: '" + url + "'; please " +
                                       "verify that the file exists. " +
                                       "XHR status code: " + status, synchronous);
                }
    
    
                // Prevent potential IE memory leak
                xhr = null;

  7. #17
    Ext JS Premium Member rstuart's Avatar
    Join Date
    Jan 2008
    Location
    Brisbane, Australia
    Posts
    140
    Vote Rating
    4
    rstuart is on a distinguished road

      0  

    Exclamation


    Just to update everyone, CORS support will not work with any IE browser/XDomainRequest. See this.

Similar Threads

  1. Ext 4.0 (offline support, local database support)
    By tfrugia in forum Community Discussion
    Replies: 1
    Last Post: 27 Apr 2010, 8:05 AM

Thread Participants: 7