离子框架：不在设备上加载谷歌地图库

Posted 2023-03-27

【中文标题】离子框架：不在设备上加载谷歌地图库

【英文标题】：Ionic Framework: Not loading google maps library on device

【发布时间】：2015-11-11 00:24:17

【问题描述】：

我正在尝试在 ionic 应用中实现 Google 地图。地图库正在 Web 浏览器上加载，但在设备上抛出 404。

为了实现地图，我安装了“白名单”和“地理位置”插件，如下所示：

离子插件添加https://github.com/apache/cordova-plugin-whitelist.git

离子插件添加cordova-plugin-geolocation

另外，向 config.xml 添加了访问 origin="*"。 请在这方面帮助我。

谢谢。

【问题讨论】：

跟随本教程link

【参考方案1】：

仅白名单插件是不够的。您还需要使用官方白名单插件文档中提到的适当的安全元标记。

但是该文档中缺少一件事。此元标记必须根据特定需求进行调整，在本例中是针对 Google Maps V3 API。

这是一个必需的元标记，我可以确认它适用于 Google 地图：

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

如果您需要更多参考资料，可以在我关于此主题的博客文章中找到它们：

http://www.gajotres.net/using-cordova-geoloacation-api-with-google-maps-in-ionic-framework/

我什至可以向您发送一个工作示例。

【讨论】：

非常感谢您的快速回复。我尝试使用您给出的上述元标记，然后它也抛出以下错误：加载资源失败：服务器响应状态为 404 maps.googleapis.com/maps/api/js?key=APIKeyhere&sensor=true

您的设备连接到互联网了吗？

我也有同样的问题，CSP 是正确的，页面仍然响应 404...

尝试从 url 中移除传感器部分