移动端浏览器优先打开APP，否则跳转下载页

最新推荐文章于 2022-04-07 15:01:16 发布

chiti3652

最新推荐文章于 2022-04-07 15:01:16 发布

阅读量245

点赞数

原文链接：https://my.oschina.net/konglo/blog/419727

版权

产品上会存在这类需求，在微信/手机QQ中打开分享链接，优先跳转APP，若没安装，则跳转下载页面。

先看代码：

<html>
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <script src="http://192.168.100.14:81/js/jquery-1.7.1.min.js" type="text/javascript"></script>
</head>
<body>
<div>
<a onclick="try_to_open_app();" href="alipays://platformapi/startapp">打开支付宝</a>
</div>
<script language="javascript">
    $(function () {
        window.location.href = 'alipays://platformapi/startapp';
    });

    var timeout;
    function open_appstore() {
        window.location.href='https://itunes.apple.com/cn/app/id333206289?mt=8';
    }
    function try_to_open_app() {
        timeout = setTimeout('open_appstore()', 1000);
    }
</script>
</body>
</html>

实际上是一个比较猥琐的方法，基本思路是：在<a>上同时设上href与onclick，让onclick延迟1秒执行，若手机中安装有指定应用，则会打开应用，否则会跳转到指定的下载页面。

这个方法在不同系统、不同浏览器上的表现与限制都各有不同，以下是实验后得出的初步结论：

	IOS(Safari)	安卓(系统默认浏览器)
安装APP	打开APP，不跳转下载页	打开APP，同时跳转下载页
未安装APP	跳转下载页	跳转下载页

同时不同浏览器也对使用URL打开APP这种方式，有诸多限制，目前只调研了三种比较典型的：

	微信内置浏览器	手机QQ内置浏览器	UC浏览器
使用href打开	拦截，无法打开	可以打开	拦截，询问是否打开
使用js方法打开(window.location.href)	拦截，无法打开	拦截，无法打开	拦截，询问是否打开

可以看出，如果安装了APP的情况下，系统浏览器可以顺利自动打开APP，手机QQ需要依赖用户点击，微信只能提示用户在

其他浏览器里打开了。

这个结论还比较初略，实际使用的时候还需要处理很多兼容性的问题。

转载于:https://my.oschina.net/konglo/blog/419727

chiti3652

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
移动端浏览器优先打开APP，否则跳转下载页

产品上会存在这类需求，在微信/手机QQ中打开分享链接，优先跳转APP，若没安装，则跳转下载页面。先看代码： <html><head><metacontent="text/html;charset=utf-8"http-equiv="...
复制链接

扫一扫