程序员经验分享-hwhale

Cordova、iOS 和 iframe 不会加载内容，除非我允许访问 href="*"

2024-03-02

我有一个网络应用程序，它有一个嵌入式地图字段，它是使用 iframe 实现的https://maps.google.com/ https://maps.google.com/...

我正在将我们的应用程序（当前作为主屏幕图标运行）移植到 iOS 上的 Cordova，因此添加了 Cordova 包装器。我们已经通过 Cordova 在 Android 上运行该应用程序。

我有一个div，有一个子元素

<iframe src="https://maps.google.com/?iwloc=&output=embed&q=something"></iframe>

最初，当 Cordova 项目只关注 Android 时，我曾config.xml

<access origin="*" />
<access origin="file://*" />
<access origin="http://*" />
<allow-navigation href="http://*" />

然而，这是行不通的。这iframe地图 url 甚至不会尝试加载，并且没有任何迹象表明原因。

所以我开始阅读并尝试这些设置，基本上在 iOS 上，它们所做的就是映射到NSAppTransportSecurity设置在Info.plist.

事实证明<allow-navigation href="http://*" />被完全忽略，仅支持指定域或仅支持 * 的允许导航，因此我尝试了更具体的基于域的导航，例如

<allow-navigation href="http://maps.google.com/*" />

这会创建一个域条目maps.google.com和集NSExceptionAllowsInsecureHTTPLoads to true但 iframe 仍然无法加载。

我能找到的唯一允许 iframe 加载地图 URL 的方法是添加

<allow-navigation href="*"/>

这基本上设置了NSAllowsArbitraryLoads to true这基本上会关闭 TLS，并会触发应用程序审核并需要理由。

边注：<access origin="*"/>还设置NSAllowsArbitraryLoads to true但单独阻止初始 URL 加载到 webview 内部（它从外部加载）。

我对 config.xml 或 config.xml 的组合有点不知所措NSAppTransportSecurity设置我需要让它工作，而不仅仅是允许一切和应用程序审查问题，这无疑会触发。

注意：这些请求不会触发 CSP 警告，我认为 webview 甚至没有达到那么远，如果我将allow-navigation 设置为 * 它可以工作，这表明 CSP 没问题。

当它失败时，我在 Web 调试器中针对该请求得到的只是“尝试加载资源时发生错误”，而 XCode 控制台中没有任何内容。


在解决了同样的问题之后，我找到了一个适合我的配置！

我希望我的应用程序在 iframe 中包含 Google 日历，这意味着我需要为 Cordova 指定 Google 日历的 URL 应在应用程序的 Web 视图中处理。

Having <allow-navigation href="*" />使其工作，但它有一个副作用，即用户单击的所有链接也将在网络视图内处理（我的应用程序具有向用户提供新闻提要的功能，有时文本中会有用户的链接点击）。在我的应用程序的全屏 Web 视图中包含任意网页，用户无法导航回我的应用程序。在 Android 上总是有一个“后退按钮”，但在 iOS 上没有，迫使用户退出应用程序。

我的解决方案有两个方面：在allow-navigation中指定URL并设置允许内容和脚本的CSP：

In config.xml:

<access origin="*"/>
<allow-navigation href="https://calendar.google.com/*" />
<allow-navigation href="https://apis.google.com/*" />
<allow-navigation href="https://clients6.google.com/*" />

在 iOS 上，这还不够calendar.google.com;我必须找到 iframe 访问的所有域，因此需要上面的三个 URL。我使用 Chrome 的检查工具中的网络日志来查找这些域。 对于 Android 来说这是没有必要的。

我本可以设置<allow-navigation href="https://*.google.com/* />，但这对于我的需求来说太宽泛了（例如，指向“www.google.com”的链接将在 webview 而不是外部浏览器中处理）。

In index.html:

<head>
...
    <meta http-equiv="Content-Security-Policy"
          content="default-src * 'self' data: gap: 'unsafe-inline' 'unsafe-eval';
          style-src * 'self' 'unsafe-inline' 'unsafe-eval' gap:;
          script-src * 'self' 'unsafe-inline' 'unsafe-eval' gap:;">
...

注意 - 上面的 CSP 可能允许太多。但这只是一个起点，然后您可以根据应用程序的需求缩小访问范围。

现在应用程序呈现iframe在 iOS 和 Android 上正确使用 Google 日历 URL，并允许其他链接调用设备的浏览器（即应用程序外部）。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

ios

Cordova

iframe

Cordova、iOS 和 iframe 不会加载内容，除非我允许访问 href="*" 的相关文章

随机推荐

  • Q 学习代理的学习率

    学习率如何影响收敛速度和收敛本身的问题 如果学习率恒定 Q函数是否会收敛到最优值 或者学习率必须衰减以保证收敛 学习率表示解决问题所采取的步骤的大小 It 不宜太大一个数字 因为它可能会在最小值周围持续振荡 并且它不宜太小否则 将需要大量时

  • 参考Qt中的Sender对象

    我遇到了一些麻烦 我对 Qt 和 C 相当陌生 可以说是在试水 我将尝试如下描述我的问题 我有一条线编辑QLineEdit此编辑有一个如下所示的连接 connect my lineedit SIGNAL textEdited QString

  • php xpath获取属性等于的节点

    我有一个 xml 如何获取节点levelone有一个名为myatt其值为a然后访问它的myval 我尝试参考其他帖子来使其工作 但它似乎不起作用我的 xpath 有什么问题 this gt myXmlObj gt xpath levelon

  • 翻转视图 iPhone

    请考虑下面的代码 并告诉我我做错了什么 我想在两个 UIView 之间切换 不知何故 当我从初始视图翻转时 我只是得到翻转的视图 没有动画 当我向后翻转时 动画显示得很好 翻转是由视图本身上的按钮触发的 IBAction showMoreI

  • [UIAlertView 显示] 如何工作？

    我想做一些类似于 UIAlertView 的事情 即 不引用任何 UIView 或 UIViewController 使用presentModalViewController 在所有窗口顶部呈现一个 UIViewController 查看文

  • vim，将 script.py 粘贴到 python 解释器会丢失格式

    我正在尝试使用 ConqueTerm 重新映射一个键 以将脚本中选定的文本拉入 放入 Python 解释器中 一切都很好 除了这个 def main print Testing 123 main 变成这样 gt gt gt def main

  • 当数据为0时，如何使chartJs堆叠条形始终四舍五入？

    我想出了这个小提琴 https jsfiddle net 2s09hqLu https jsfiddle net 2s09hqLu 它按照我想要的方式堆叠了圆形图表 但问题是当数据数组中的值为 0 时 它不会使其四舍五入 我总是希望它四舍五

  • python中的连续字母列表并获取它的每个值

    我遇到了几乎同样的问题 如何制作连续的字母列表Python 从a z然后从aa ab ac等 https stackoverflow com questions 29351492 how to make a continuous alpha

  • 放大后删除绘制的矩形缩放框

    我正在尝试编写一个透明的可拖动矩形缩放框 一旦鼠标再次抬起 它就会放大该区域并删除绘制的矩形 我已经可以进行缩放并绘制矩形 但是我不能 1 弄清楚如何使其透明 和 2 弄清楚如何在放大后删除矩形 一旦单击鼠标在放大的图像上绘制另一个缩放框

  • 错误：请求失败，状态代码为 405

    我正在尝试在 Laravel React js 组合中建立 axios 示例 我通过以下命令配置了我的项目 作曲家创建项目 prefer dist laravel laravel react laravel basic 8 php arti

  • 使用for循环遍历java中的列表

    如何使用索引迭代列表数据结构 例如 考虑一个列表形式的句子 每个元素都是一个单词 我可以使用索引逐步浏览每个单词吗 像这样的事情 sentence defined something like this List

  • Django、ModelChoiceField() 和初始值

    我正在使用这样的东西 field1 forms ModelChoiceField queryset 如何使我的表单显示所选的值 如果你想设置默认的初始值 你应该定义initial http docs djangoproject com en

  • 如何将字体精美的图标放入选择下拉菜单中？

    我一直在努力在 vuejs 的选择下拉菜单中设置一个很棒的字体图标 我尝试过一些方法 比如

  • 在javascript中使用map或reduce将二维数组转换为对象

    是否可以转换 35 Bill 20 Nancy 27 Joan to Bill 35 Nancy 20 Joan 27 使用 map or reduce 方法 我可以使用以下方法转换数组 const arr 35 Bill 20 Nancy

  • Corona SDK 的本地通知 (Android)

    有没有办法在使用 Corona SDK 时实现本地通知 这是 Android 特定的 因为我们已经找到了 iOS 方向 Cheers 目前 Corona 上的本地通知仅适用于 iOS Android 版本尚未完成 完成后 我将按照 Andr

  • 将 Numpy 矩阵显示为视频

    我有一个 numpy 矩阵 其中每一行都是一张图片 我可以重塑行并使用 matplotlib pyplot 显示图像 问题是 我不想单独显示图像 我想像视频一样依次显示它们 这在Python中怎么可能呢 好吧 我不知道这是否是最好的方法 但

  • 包含（大多数）所有元素的 HTML 页面，用于样式设置

    是否有人拥有或知道包含所有元素 带有口语文本或其他内容 的 HTML 页面 我可以做一个 但我想一定有人已经这样做了 当开始一个项目时 我喜欢为链接 列表 表格等设置一些基本样式 包含所有元素的 HTML 页面将帮助我加快此过程 我很乐意创

  • 如何在 iOS 6 中启动具有特定地址的 iOS 地图应用程序？

    我有一个应用程序 允许用户启动地图应用程序 Google 或 Apple 来查看地址 我曾经这样做过 Address address self person addresses objectAtIndex 0 NSString addres

  • 访问页面时自动点击页面上的锚链接

    我之前问过这个问题 但一些专家告诉我补充一下 这可以重新加载给定的链接 但我想知道如何在 id 的帮助下单击元素 锚点 是否有任何代码在执行时会单击 id dp99 并且我希望在访问页面时执行此 javascript 这是 HTML a h

  • Cordova、iOS 和 iframe 不会加载内容，除非我允许访问 href="*"

    我有一个网络应用程序 它有一个嵌入式地图字段 它是使用 iframe 实现的https maps google com https maps google com 我正在将我们的应用程序 当前作为主屏幕图标运行 移植到 iOS 上的 Cor

热门标签