javascript - 从子对象（如 Iframe）收集的 iPad 方向信息

Question

我正在制作一个全屏广告，通过我无法直接访问的发布商网站投放。广告利用来自 iPad 的倾斜信息来更改广告上的颜色。一切都可以独立运行，因为它是自己的网页，但是当通过我们的广告引擎提供服务时，html 会显示为子窗口对象，并且deviceorientation不会在广告中更新。

我对此感到非常惊讶，因为倾斜信息确实会传递到广告，但是当我尝试查找父窗口方向时，我收到了 js 跨域警告。

我可以做些什么来将设备方向传递给子窗口？或任何明智的解决方法

Answer 1

答案取决于域的结构。

他们有相同的根域

好的。如果您的父窗口托管在“company.com”上，而您的子窗口托管在“hifi.company.com”（反之亦然），那么通过为两个窗口设置以下属性，它们将能够进行通信。

document.domain = 'company.com';

执行此操作时，您将不再遇到跨站点脚本违规

parent.onorientationchange = function () {
     console.log(parent.orientation);
};

他们有不同的根域

然后很遗憾没有。您将无法通过子窗口访问父窗口的方向信息。您可以获得的最接近的方法是监听子窗口本身的调整大小事件。但这取决于 iframe 的大小以及视口的配置方式。