前言

在项目中遇到一个需求，就是微信分享的页面，邀请新用户注册，需要判断该用户是否安装该应用，如果安装了那就直接唤醒进入，如果没有那就提醒用户需要下载，并且跳到应用市场去下载，或者给一个下载链接让用户直接下载

这折腾的过程中发现URL scheme这个方法，就记录下来

scheme是一种页面之件间跳转的协议，不仅可以用于app之间的跳转，还可以用于h5跳转到app,无论是android还是ios都可以通过在h5页面打开scheme协议的地址，从而打开app。

在这里需要android和ios配置跳转的scheme

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document </title>
</head>
<body>
    <button onclick="button_click()">点我点我</button>
    <script>
        function button_click(){
			alert("33334444333");
           //这里举个美团的例子   imeituan://就是android和ios需要设置的scheme
			window.location.href= "imeituan://"; 
           //这样如果你安装了app就可以成功唤醒app了
        }
    </script>
</body>
</html>

然后还需要判断用户是否安装了app,然而h5在浏览器中是没有能力判断手机是否安装了某个app的，所以在这里采取一种反向思维的方式

浏览器在尝试打开url scheme时如果能唤起app就说明打开成功，如果唤不醒就没得反应，所以可以抓住这个时间点，如果在点击跳转后两到三秒没有反应就说明没有安装，这个时候就引导用户去下载

<script>
        function button_click(){
			var appDownloadURL = "https://www.baidu.com";
			alert("33334444333");
           //这里举个美团的例子   imeituan://就是android和ios需要设置的scheme
			window.location.href= "imeituan://"; 
           //这样如果你安装了app就可以成功唤醒app了
            //这个延时就是在三秒没有反应跳到百度了，这里你可以写下载链接。或者引导用户下载。
			setTimeout(function(){
				window.location.href= "https://www.baidu.com";
			},3000)
        }
    </script>

还有就是要判断是否是在微信浏览器中打开，还多应用的scheme不支持在微信浏览器打开，所以要判断是否为微信浏览器，然后引导用户复制链接到外部浏览器打开。

结束语

我这个还不是很全面，后期遇到什么坑再来补全。