首页 文章

Cordova iOS空白iframe

提问于
浏览
5

在我正在使用的Cordova应用程序中,有一个iframe . 问题是,在测试应用程序(模拟器和设备)时,iframe是空白的 . 在Android上,iframe工作正常 .

iframe在Angular指令中动态加载 .

在指令链接函数中,以下代码用于加载iframe并将其附加到指令的元素:

var iframe = angular.element('<iframe class="widget" width="' + widgetWidth + '" height="' + widgetHeight + '"></iframe>');
iframe.attr('src', url);
element.append(iframe);

我也尝试过使用以下几行:

var iframe = document.createElement('iframe');
iframe.src = url;

这导致类似于以下内容(使用Safari Web检查器):

<iframe class="widget" width="384" height="505" src="http://hostname/correct/uri"></iframe>

在我的index.html文件中,我有以下设置:

<meta http-equiv="Content-Security-Policy" content="script-src * 'unsafe-eval'; connect-src * 'unsafe-eval'; object-src 'self'; style-src * 'unsafe-inline';">

我的cordova config.xml中还有以下几行:

<access origin="*" subdomains="true" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

Safari Web Inspector中也没有错误或警告 .

所以我的问题是,是否有一些技巧让iFrames在我缺少的Cordova iOS应用程序中工作 . 或者我当前的配置/代码有什么问题?

我正在使用angularjs 1.5.3并且有jquery 2.2.1(在angularjs之前加载)以防万一 .

2 回答

  • 13

    问题是allow-navigation标签 . 所以要解决它我只需要将 <allow-navigation href="*" /> 标记放入项目的config.xml文件中 .

    当模拟器运行时,我通过xcode中的输出框找到了解决方案 . 有一条消息包含有问题的iframe的网址以及“内部导航被拒绝”的内容 .

  • 1

    您是否尝试在Content-Security-Policy元标记中设置child-src和/或frame-ancestors?这些可能需要设置为*或更严格的内容,例如您正在使用的iframe源URL .

    content-security-policy.com有关于此的信息

    基于内容安全策略的示例:

    <meta http-equiv="Content-Security-Policy" content="script-src * 'unsafe-eval'; child-src *; connect-src * 'unsafe-eval'; object-src 'self'; style-src * 'unsafe-inline';">
    

相关问题