Question

我有一个通过Facebook Messenger应用程序打开的Web应用程序。在移动设备上，它是在Facebook Messenger的Web视图中打开的；在台式机上，它是在iFrame中打开的。此功能适用于除IE11之外的所有浏览器。

我们正在将X-Frame-Options标头设置为“ ALLOW-FROM https://www.messenger.com”。首次将应用程序加载到iFrame中时，不会出现任何问题。然后，应用程序以302响应请求并重定向。重定向到该页面的页面显示错误“此内容无法在框架中显示”。控制台中没有错误，就像其他浏览器中阻止iFrame内容时一样。

IE11不支持iFrame中重定向的某些方面吗？

更多应用细节：这是在客户端上使用JS的Django服务器端呈现的Web应用程序。我将尝试分解操作顺序：

请求1：获取返回文档的终结点1的GET-成功在iFrame中显示

请求2：从客户端上的JS POST到endpoint1

const formData = new FormData();

        formData.append('psid', thread_context.psid);
        formData.append('tid', thread_context.tid);

        const xhr = new XMLHttpRequest();

        xhr.onload = function (event) {
            if (this.status !== 200) {
                handleError(this);
                return;
            }

            window.location.href = this.responseURL;
        };
        xhr.onerror = handleError;

        xhr.open('POST', postUrl);
        xhr.send(formData);

响应是带有位置标头的状态代码302

请求3：获取302响应中返回的位置。响应是状态码200，并在正文中包含文档。这将导致上面的xhr.onload触发，然后调用window.location.href重定向到先前返回的新位置。

请求4：由于更新window.location.href而获得的GET。响应是状态码200。这是浏览器显示“内容无法在框架中显示”消息的时候。

这些请求中的每个请求都在响应中包括“ ALLOW-FROM https://www.messenger.com”的X-Frame-Options标头。

Answer 1

因此，结果表明“无法在框架中显示内容”消息是一条红色鲱鱼。问题确实是由于设置：

window.location.href = this.responseURL;

在IE和Edge responseURL is not a supported property of XMLHttpRequest中可能更旧。另外，似乎无法在IE中的302之后获取请求URL。因此，我的解决方案将是重写我们返回302的用法，而不是返回带有URL重定向的JSON响应。

IE11重定向后将忽略X-Frame-Options

1 个答案: