在我正在使用的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 回答
问题是allow-navigation标签 . 所以要解决它我只需要将
<allow-navigation href="*" />
标记放入项目的config.xml文件中 .当模拟器运行时,我通过xcode中的输出框找到了解决方案 . 有一条消息包含有问题的iframe的网址以及“内部导航被拒绝”的内容 .
您是否尝试在Content-Security-Policy元标记中设置child-src和/或frame-ancestors?这些可能需要设置为*或更严格的内容,例如您正在使用的iframe源URL .
在content-security-policy.com有关于此的信息
基于内容安全策略的示例: