Android WebView加载H5页面,H5页面使用URL Scheme唤起APP失败

本文解决H5页面中URLScheme在WebView环境下无法成功唤起第三方APP的问题,通过修改WebViewClient的shouldOverrideUrlLoading方法实现自定义URL的正确处理。

1. 前言

最近遇到了一个问题,H5页面使用URL Scheme唤起第三方APP,在手机浏览器已经测试通过了,但是在APP里面,却失败了。

本篇文章不介绍如何使用URL Scheme唤起APP,如果想知道的朋友,可以查看下列文章:

回归正题,我们以“爱奇艺在线视频网站(https://m.iqiyi.com)”为例,使用WebView来加载,显示如下:

点击“打开看看”,正常情况是打开爱奇艺APP(如果手机没安装,会弹出下载APP安装包的提示窗口),但实际上却报错了,报错信息的大概意思是:未知的URL Scheme,如下图所示:

2. 解决方案

经过查找相关资料,并调试相关代码,定位到了问题所在。

mWebView.setWebViewClient(new WebViewClient());

原来是因为WebView设置WebViewClient,导致所有URL都默认使用WebView进行加载了,但是像“iqiyi://mobile/register_business/qyclient?pluginParams=%25”(这是唤起爱奇艺APP的URL的一部分)这种自定义URL,WebView是无法加载成功的。

如果已经了解过URL Scheme的朋友,应该是知道Android可以这样来唤起第三方APP。

// url是符合第三方APP所规定的Scheme的URL,可以用来唤起第三方APP
startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));

所以,我们可以通过拦截URL的方式来解决这个问题,具体代码如下:

mWebView.setWebViewClient(new WebViewClient() {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        // WebView可以加载Http、Https和file这三种URL,所以除了这三种URL外,其他都要另外处理
        if (!url.startsWith("http") && !url.startsWith("file")) {
            try {
                startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));
            } catch (Exception e) {
                // 如果找不到合适的APP来加载URL,则会抛出异常
                e.printStackTrace();
            }
            return true;
        }
        return super.shouldOverrideUrlLoading(view, url);
    }
});

完整的demo可以查看 AndroidWebView

 

如果想进一步交流和学习的同学,可以加一下QQ群哦!

H5页面中实现跳转到地图App或在本地App加载H5页面唤起地图App进行导航,可以通过URL Scheme或Universal Links的方式实现。不同地图App(如高德地图、百度地图)提供了相应的协议格式,开发者可以根据需求构造对应的URL,触发系统跳转至对应的地图应用[^1]。 ### 使用URL Scheme唤起地图App #### 百度地图 可以通过构造百度地图的URL Scheme实现唤起百度地图并进行导航。例如: ```javascript window.location.href = `baidumap://map/direction?origin=${this.lat},${this.lng}&destination=${latEnd},${lngEnd}&coord_type=bd09ll&mode=driving&src=andr.baidu.openAPIdemo`; ``` 其中,`origin`表示起点坐标,`destination`表示终点坐标,`coord_type`为坐标类型(如`bd09ll`表示百度经纬度),`mode`表示导航方式(如驾车、步行等)[^2]。 #### 高德地图 高德地图同样支持通过URL Scheme唤起应用并进行导航。示例如下: ```javascript window.location.href = `amapuri://route/plan/?sid=BGEOF&sname=起点名称&did=BGEOF&dname=终点名称&dev=0&t=2`; ``` 其中,`sid`和`sname`表示起点ID和名称,`did`和`dname`表示终点ID和名称,`t`表示出行方式(如2表示驾车)[^1]。 ### 使用Universal Links唤起地图App Universal Links是苹果推出的通用链接技术,允许通过标准的HTTP链接直接打开iOS应用,前提是该应用已安装并且配置了相应的关联域名。对于地图导航场景,可以使用如下格式的Universal Link: - **高德地图**:`https://uri.amap.com/map?` - **百度地图**:`https://map.sample.com/baidu` 具体的参数格式和使用方式可以参考高德或百度的官方文档,确保链接格式正确,并在应用中配置好对应的域名白名单和关联应用信息[^1]。 ### 在本地App加载H5页面唤起地图App 如果H5页面是在本地App(如使用uni-app开发的混合应用)中加载的,可以通过WebView拦截特定的URL请求,或使用JSBridge调用原生功能,从而实现唤起地图App。例如,在uni-app中可以通过如下方式调用: ```javascript uni.navigateTo({ url: '/pages/mapApp/mapApp' }); ``` 在`mapApp`页面中,可以进一步调用原生的地图导航功能,或者直接使用上述的URL Scheme跳转至地图App[^1]。 ### 注意事项 - **iOS系统限制**:从iOS 9开始,Apple对URL Scheme使用进行了限制,建议优先使用Universal Links。 - **Android系统兼容性**:不同Android厂商可能对URL Scheme的支持存在差异,建议进行多机型测试。 - **应用未安装处理**:如果用户未安装对应的地图App,建议检测安装状态并引导用户跳转至应用商店下载页面。 ---
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值