Question

我一直无法找到有效的答案。我有一个iframe（是的，我必须在这种情况下使用iframe）在PC上工作正常，但根本不会在手机或平板电脑上加载。

页面上有一些Javascript但删除它并不能解决问题。我也尝试将iframe的高度和宽度从百分比更改为固定值。我还尝试从src以外的iframe中删除所有属性，但仍然没有在iframe中加载任何内容。

下面是我的页面的简化版本，使用了我从其他建议中可以找到的内容。

<!DOCTYPE html>
<html>
    <head>
     <meta charset="UTF-8">
     <meta content='width=device-width, initial-scale=1.0' name='viewport'>
     <style type="text/css">
                body, html
                {
                    margin: 0; padding: 0; height: 100%; overflow: hidden;  -webkit-backface-visibility: visible;
                }

                #content
                {
                    position:absolute; left: 0; right: 0; bottom: 0; top: 0px; 
                }
            </style>
    </head>
    <body> 

    <script type="text/javascript">
    function onFrameLoad() {
            do stuff
    };
    </script>

    <div id="content">
    <iframe onload="onFrameLoad(this)" id="app" src="https://subdomain.mydomain.com" frameborder="0" height="100%" width="100%"></iframe>
    </div>
    </body>
    </html>

有谁可以告诉我为什么它不能在移动设备上运行？感谢

更新：清除平板电脑上的浏览器缓存会修复此问题，但在移动设备上执行此操作并未执行任何操作。我也尝试过使用我朋友的iPhone（他们之前从未访问过该网站）并且没有加载。

我尝试在iframe中显示的网址在我的手机上的w3schools等演示网站上的iframe中运行，因此它不是x-frame options或浏览器不允许任何iframe问题（尽管x-frame选项会阻止它在所有设备上工作，但我已经检查了我能想到的一切）

如果需要，我可以通过消息提供实时示例网址。

Answer 1

问题就像我所怀疑的那样 - 如果内容在安全和非安全之间混合，iframe的URL会调用一些不安全的元素，移动设备和平板电脑上的某些浏览器（以及桌面上的Firefox）不会显示任何内容。我的域名都是https）。

现在已经修复了这些内容并安全地托管/调用了所有内容，完全清除缓存并重新加载页面即使在移动浏览器上也能解决问题。

它在平板电脑上运行而不是移动设备的原因完全取决于时间安排以及何时不同元素https链接被破坏（重定向到http）以及缓存不同页面的时间。

Answer 2

我在iOS的WebView上遇到了与iframe和跨域访问类似的问题。问题在于Cookie Acceptance导致了问题。

问题是UIWebView的Cookie安全策略（HTTPCookieAcceptPolicy），该策略以前默认为NSHTTPCookieAcceptPolicyAlways。

但是从iOS 7开始，它被默认为NSHTTPCookieAcceptPolicyOnlyFromMainDocumentDomain，破坏了我的应用程序。

你的问题看起来不一样，但可能会出现类似的问题。

Answer 3

从现在开始，到2019年，通过移动浏览器和Chrome浏览器进行测试，无论主机页面使用http还是https，iframe网址都必须使用 https 。 http iframe根本不会加载。

Answer 4

可能不链接到问题，而是：

当我使用https：// localhost在我的Android手机上进行测试时，我的iframe一打开便关闭了，

问题是移动浏览器不信任我使用的ssl证书，因为它是开发ssl证书。我是通过检查网络调试工具发现的，请参见下图：

iFrame未在手机或平板电脑上加载

4 个答案: