Microsoft Edge easyXDM on("message")事件未被调用

Question

在Microsoft Edge中,GET请求未运行.我已经逐步完成了代码运行的AJAX请求,并在回调中设置了一个断点.但是,代码永远不会到达回调.

我已经有一个带回调的.then()和.fail()设置,并尝试使用回调添加.done()和.always(),但回调函数中没有任何代码正在运行.

然后我检查了dev-tools中的网络选项卡,我根本找不到请求.似乎Edge由于某种原因没有关闭请求.

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;
    }

UPDATE

看起来问题出在easyXDM中.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不调用该方法.它没有被调用的唯一浏览器是Edge(适用于IE8 +,Chrome,Safari,FF和移动chrome/safari).

Answer 1

事实证明，之前的开发人员在我们的 easyXDM 实现中写入了必需的“hack”。

在我们的 easyXDM 实现中，我们必须更新WindowIE 上的对象，因为我们的应用程序在 iFrame 中启动。由于 Edge 从技术上讲不是 IE 的版本，因此我们的测试失败了，因此代码未运行以更新window到window.parenteasyXDM 的上下文中。

我们用来typeof document.documentMode === 'number'检测 IE，但document.documentMode在 Edge 中未定义，因此我们添加了navigator.userAgent对 Edge 的检查。

这解决了这个问题。