javascript माइक्रोसॉफ्ट एज आसान एक्सडीएम ऑन("संदेश") को नहीं बुलाया जा रहा है



ajax cors (1)

यह पता चला है कि एक आवश्यक "हैक" था जो कि पिछले डेवलपर ने easyXDM के कार्यान्वयन में लिखा था।

EasyXDM के हमारे कार्यान्वयन में, हमें Window ऑब्जेक्ट को IE पर अपडेट करना पड़ा क्योंकि हमारे ऐप एक आईफ्रेम में लॉन्च करते हैं। जैसा कि एज तकनीकी तौर पर IE का कोई संस्करण नहीं है, हमारा परीक्षण असफल रहा था, इसलिए कोड को आसान करने के लिए window को अपडेट करने के लिए नहीं चल रहा था।

हम typeof document.documentMode === 'number' का उपयोग कर रहे हैं typeof document.documentMode === 'number' को IE का पता लगाने के लिए, लेकिन document.documentMode एज में अपरिभाषित है, इसलिए हमने एक navigator.userAgent जोड़ा। एज एज के लिए जांच।

इस मुद्दे को हल किया

माइक्रोसॉफ्ट एज में, एक GET अनुरोध नहीं चल रहा है मैंने कोड के माध्यम से AJAX अनुरोध को चलाने के बिंदु पर कदम रखा है, और कॉलबैक (नों) में एक ब्रेकपॉइंट सेट कर दिया है। हालांकि, कोड कभी कॉलबैक तक नहीं पहुंचता है।

कॉलबैक के साथ पहले से एक .then () और .fail () सेटअप है, और कॉलबैक के साथ .done () और .ways () जोड़ने की कोशिश की, लेकिन कॉलबैक में से कोई भी कोड चल रहा है।

मैंने तब देव-उपकरण में नेटवर्क टैब की जांच की, और मुझे अनुरोध बिल्कुल नहीं मिल सकता है। ऐसा लगता है कि एज कुछ कारणों से अनुरोध बंद नहीं कर रहा है।

request = function(options, resolveScope) {
    var deferred = $.Deferred();
    corsHandler.makeRequest(options)
        .done(this._wrap(function(response) {
            deferred.resolveWith(resolveScope, [response]); //never gets here
        }, this))
        .fail(this._wrap(function(response) {
            deferred.rejectWith(resolveScope, [response]); //never gets here
        }, this));
    return deferred;
}

उपरोक्त अनुरोध समारोह को कॉल करने वाला यह है

ajaxFunc = function(data, scope) {
    return request({
        url: '/path/to/server',
        internalUrl: true,
        method: 'GET',
        datatype: 'json',
        data: data
    }, scope);
}

यह उस अनुरोध को बनाने के लिए प्रयोग किया जाता है।

(function() {
    // set data var
    return ajaxFunc(data, self)
        .then(function(res) { console.log(res); }) //never gets here
        .done(function(res) { console.log(res); }) //never gets here
        .fail(function(res) { console.log(res); }) //never gets here
        .finally(function(res) { console.log(res); }) //never gets here
 })();

यहाँ पेट सामान है (मुझे इस बारे में पूरी जानकारी नहीं है।)

 corsHandler.makeRequest = function(options) {
        // resolve default options
        _.defaults(options, {
            xhr:        null,
            corsUrl:    null,
            url:        null,
            method:     'GET',
            data:       {},
            success:    function() {},
            error:      function() {},
            terminate:  false,
            binary:     false,
            headers:    {},
            internalUrl: false,
            datatype: ''
        });
        // if url is internal, create absolute url from relative url
        if (options.internalUrl) {
            options.url = this.createAbsoluteInternalUrl(options.url);
        }

        // resolve cors url or proxy url
        options.corsUrl = options.corsUrl || this.getCorsUrl(options.url);
        if (!options.corsUrl) {
            options.url     = this.getProxyUrl(options.url);
            options.corsUrl = this.getCorsUrl(options.url);
        }

        // create xhr
        if (!options.xhr && options.corsUrl) {
            options.xhr = this.createXhr(options.corsUrl);
        }

        // create cleanup procedure
        var cleanUpAfterRequest = $.proxy(function() {
            if (options.terminate) {
                options.xhr.destroy();
                this._removeCacheXhr(options.corsUrl);
            }
        }, this);

        // prepare deffered object
        var deferred = $.Deferred();
        deferred
            .done(function() {
                if (options.success) {
                   options.success.apply(null, Array.prototype.slice.call(arguments));
                }
            })
            .fail(function() {
                if (options.error) {
                    options.error.apply(null, Array.prototype.slice.call(arguments));
                }
            });

        // make actual request
        if (!options.xhr) {
            throw 'corsHandler: xhr object was not created or defined to make request'; 
            // this does not happen
        }
        options.xhr.request(
            {
                url:    options.url,
                method: options.method,
                data:   options.data,
                binary: options.binary,
                headers: options.headers,
                datatype: options.datatype
            },
            function() {
                deferred.resolve.apply(null, Array.prototype.slice.call(arguments));
                cleanUpAfterRequest();
            },
            function() {
                deferred.reject.apply(null, Array.prototype.slice.call(arguments));
                cleanUpAfterRequest();
            }
        );
        return deferred;
    }

अद्यतन करें

ऐसा लगता है कि यह समस्या आसान XDM में है waitForReady() on(window, "message", waitForReady) फायरिंग नहीं है मैं इस मुद्दे पर अब और अधिक देख रहा हूं

easyXDM स्निपेट:

    targetOrigin = getLocation(config.remote);
    if (config.isHost) {
        // add the event handler for listening
        var waitForReady = function(event){
            if (event.data == config.channel + "-ready") {
                // replace the eventlistener
                callerWindow = ("postMessage" in frame.contentWindow) ? frame.contentWindow : frame.contentWindow.document;
                un(window, "message", waitForReady);
                on(window, "message", _window_onMessage);
                setTimeout(function(){
                    pub.up.callback(true);
                }, 0);
            }
        };
        on(window, "message", waitForReady);

        // set up the iframe
        apply(config.props, {
            src: appendQueryParameters(config.remote, {
                xdm_e: getLocation(location.href),
                xdm_c: config.channel,
                xdm_p: 1 // 1 = PostMessage
            }),
            name: IFRAME_PREFIX + config.channel + "_provider"
        });
        frame = createFrame(config);
    }

ऊपर स्निपेट चलाता है, लेकिन waitForReady विधि को कभी भी नहीं कहा जाता है। यह एकमात्र ब्राउज़र नहीं है जिसे एज (आईई 8 +, क्रोम, सफारी, एफएफ और मोबाइल क्रोम / सफारी में काम करता है) में नहीं बुलाया गया है।





easyxdm