谷歌地图跨平台网址在“应用内导航”后无法在 Android 上加载路线

Posted 2023-05-07

【中文标题】谷歌地图跨平台网址在“应用内导航”后无法在 Android 上加载路线

【英文标题】：Google maps cross-platform URL fails to load route on Android after "in app navigation"

【发布时间】：2020-12-19 09:07:01

【问题描述】：

我有一个 Angular 9 + Ionic 5 应用程序，部署为 PWA、android 和 ios 应用程序。 我们使用谷歌的通用、跨平台 URL 来启动谷歌地图， 如此处所述：https://developers.google.com/maps/documentation/urls/get-started

在谷歌地图中打开位置的功能：

export const openMaps = (lat: number, lng: number) => 
  const url = `https://www.google.com/maps/search/?api=1&query=$lat%2C$lng`;
  return window.open(url, '_top').focus();
;

这在 PWA 和 IOS 应用程序中运行良好，但是在 Android 中，地址按预期加载到浏览器中后，在 Route planner 中支持开始位置并点击“IN APP NAVIGATION”后无法启动导航。 （如果我提供带有方向的链接以自动开始导航，也会发生同样的情况）。

点击“IN APP NAVIGATION”后显示错误： 网页位于 intent://maps.app.goo.gl/?link=https://www.google.com/maps/dir//50.253722,10.958954/@49.9145812,10.9626145,8z/data%3D!4m2! 4m1!3e0!11m1!6b1?entry%3Dml&apn=com.google.android.apps.maps&amv=914018424&isi=585027354&ibi=com.google.Maps&ius=comgooglemapsurl&utm_campaign=ml_promo&ct=ml-nav-nopromo-dr-nlu-wv-msc&mt= 8&pt=9008&efr=1#Intent;package=com.google.android.gms;scheme=https;S.browser_fallback_url=https://play.google.com/store/apps/details%3Fid%3Dcom.google.android。 apps.maps&pcampaignid%3Dfdl_long&url%3Dhttps://www.google.com/maps/dir//50.253722,10.958954/@49.9145812,10.9626145,8z/data%253D!4m2!4m1!3e0!11m1!6b1%3Fentry%253Dml&min_version% 3D914018424;结束;无法加载，因为：

net::ERR_UNKNOWN_URL_SCHEME

有人知道这里出了什么问题吗？ URL 语法应该是正确的，但似乎谷歌地图意图在 Android 上加载了一个未知的方案。

【参考方案1】：

解决了！问题是window.open(url, '_top').focus();

这些链接应与target: _system.一起使用

如果是混合 Ionic 应用程序，还推荐使用以下插件！ https://ionicframework.com/docs/native/in-app-browser