17

我正在开发一个 phonegap/cordova 应用程序。有没有办法在浏览器视图中打开手机的本机导航应用程序？或者是否有从 html5 应用程序打开本机地图应用程序的最佳实践？还是它们都是特定于平台的？

我已经阅读了以下适用于某些版本的 Android 的地方

<a href="geo:some address here" />Navigate to here</a>

这适用于iOS

<a href="http://maps.apple.com/?daddr=San+Francisco,+CA&saddr=cupertino">Directions</a>

我很惊讶Phonegap 没有实现这样的东西。

4

5 回答 5

17

您可以使用神奇的“地图：”协议在 iOS 5（谷歌地图）和 iOS 6（苹果地图）上打开本机导航应用程序，例如window.location = "maps:daddr=50.4,-4.5"

但要在 Android 上启动原生 Google Navigator 应用程序，您需要使用 phonegap 插件。我写这个是为了我自己的目的。

更新 该插件现已针对 Phonegap 3.x 进行了更新，并支持 Android、iOS 和 Windows Phone，包括在 iOS 上首选 Google Maps 的选项。

插件在这里：https ://github.com/dpa99c/phonegap-launch-navigator

于 2013-06-22T21:44:32.687 回答
7

插件很棒！感谢分享！我在我的应用程序中尝试过，但不幸的是我有 Phonegap 3.x 版，你的插件只适用于 Phonegap 2.x :(

因此，为了让它在 Phonegap 3.x 上运行，我从你的 github 存储库中获取了插件并进行了一些更改，以便它适用于 3.x

Phonegap 3.x 修改后的 PhoneNavigator 插件可以从我的 github 仓库下载： https ://github.com/viktor0710/PhoneNavigator-Phonegap-3.x.git

如何将它集成到您​​的 Phonegap 3.x 项目中：

  1. 打开控制台窗口
  2. 转到您的 Phonegap 应用程序根目录
  3. 然后执行：phonegap local plugin add https://github.com/viktor0710/PhoneNavigator-Phonegap-3.x.git
  4. 从您的应用程序中的 repo (www/phonenavigator.js) 复制“phonenavigator.js”（例如：yourapp/www）
  5. 在您的应用中包含“phonenavigator.js”：
  6. 从您的应用程序中的 repo (www/cordova.js) 复制“cordova.js”（例如：yourapp/www）
  7. 在您的应用程序中包含“cordova.js”：

如何使用它：

//function declaration
function navigateTo (lat, lon, successFn, errorFn) {
    cordova.require('cordova/plugin/phonenavigator').doNavigate(lat, lon, successFn, errorFn);
}

//set lat and lon variables. Most probably read them from the UI
var latitude =  48.137607;
var longitude = 11.568569;

//call function
navigateTo(
    latitude,
    longitude,
    function(){
        console.log("Successfully opened navigator");
    },
    function(){
        console.log("Error opening navigator");
    }
);
于 2013-11-02T14:10:53.960 回答
7

如上所述，以下适用于 Galaxy S4 Android（刚刚测试过），以调出 Google Maps/Navigation 应用程序和 waze：

<a href="geo:37.786971,-122.399677;u=35">Wikimedia Headquarters</a>

信用：http ://en.wikipedia.org/wiki/Geo_URI#Example

另请在此处查看答案：https ://stackoverflow.com/a/19765368/2728686

于 2013-11-04T10:09:03.273 回答
7

作为记录，如果有人像我一样通过在 Google 上查找这个线程，它直接对我有用，使用 Ionic 框架，通过做两件事：

  • 在应用程序的 myapp.config(...) 中添加

    $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|geo):/);

    （不要忘记添加 $compileProvider 作为依赖项）

  • 在 config.xml 中，添加该行

    <access origin="geo:*" launch-external="yes"/>

就这样。

于 2015-04-27T14:53:02.140 回答
2

Cordova 3.6.0 引入了第二个白名单，用于限制允许哪些 URL 启动外部应用程序。在以前的 Cordova 版本中，所有非 http URL，例如 mailto:、geo:、sms: 和 intent，都被隐式允许成为 a 标记的目标。由于应用程序可能泄露信息，如果 XSS 漏洞允许攻击者构建任意链接，则这些 URL 也必须被列入白名单，从 Cordova 3.6.0 开始。

Cordova 3.6.0 白名单指南

所以需要在 config.xml 中显式添加：

  <access origin="tel:*" launch-external="yes" />
  <access origin="mailto:*" launch-external="yes" />
于 2014-10-11T17:19:46.793 回答