h5唤起app解决方案

最近遇到一个需求：点击一个按钮，如果本机装有则唤起app，没有的话则跳下载页。

刚一接到需求，觉得很熟悉，实际上这个功能也确实很常见，页能搜索到一大堆方案，但是实际应用中，却发现总是很难做到100%的完美。这个大概有两个点，以微信为主的腾讯浏览器系列和其他浏览器。（因为腾讯系列会拦截scheme，手百似乎也会，不知道百度在想什么= =，至于引导用户在Safari中打开之类的方案，本文不再描述）解决方案大致有以下这么几个：

1.url scheme

这个方案基本上就是针对微信、qq内置浏览器，qq浏览器等之外的其余浏览器，从native那边要一个scheme ，然后放在a标签里或者location.href跳一下就行了，但是现在主要问提来了，前端不知道本地到底有没有安装app，这就比较尴尬，只能绕过去，最终选取了这种方案：

1

实际上也很容易看出来，就是用一个iframe去做的一个跳页，有的话唤起scheme没有的话，会触发定时器跳到下载地址。但是这个方式在ios里面，在没有app的时候会遇到两次提示，非常讨厌。

2.Universal Link（ios）

用这个方法，主要是因为你的钱冲的还不够= =（据说有些可以腾讯兄弟直接给跳），既然大家都很难做软妹币战士，那么就只能想办法。

这边在微信为主的腾讯兄弟内置浏览器里面，还是比较推荐使用应用宝的，它会自动判断是否本地有app，安卓会自动唤起，只需在尾部拼上参数&android_schema="你的scheme"他便会自动唤起app，ios就不行咯，必须跳app store，（╯‵□′）╯︵┴─┴

终于到了本段主角Universal Link，以下是这货的介绍：

这是iOS9推出的一项功能，如果你的应用支持Universal Links(通用链接)，那么就能够方便的通过传统的HTTP链接来启动APP(如果iOS设备上已经安装了你的app，不需要额外做任何判断等)，或者打开网页(iOS设备上没有安装你的app)。或许可以更简单点来说明，在iOS9之前，对于从各种从浏览器，Safari、UIWebView或者 WKWebView中唤醒APP的需求，我们通常只能使用scheme。

其实这货实际上就是一个特殊的https请求，注意，必须是https（帮ios的同学划重点 ~~），看起来好屌，似乎有很复杂，对于前端来说，我们有太多的工作要做了：

window.location.href ="native端战友给的Universal Link"

wtf？嗯，就是这样，（╯‵□′）╯︵┴─┴

实际上我们要做的就这么多= =，其他的配置就需要native协调服务端兄弟去做了：准备好与主站不同的域名，比如主站www.xxxx.com，你们可以准备好open.xxxx.com的域名作为重定向用。好吧！实际上通用链接有一个很坑的属性，必须是异域打开，而且如果你提交的是你主站的链接，你打开你的主站你会发现网站上方会挂着一个难看的灰条转向appstore中你们的app，没错，就是ios系统干的这个事，具体的其他注意事项可以参考这篇文章IOS9通用链接（universal link）。

最终实现是这样的：

2

是不是很简单~，但是也不是很完美，总感觉差点什么，算了反正也大致实现了，就以后慢慢琢磨吧，ps，这货只不过暂时没有被管制，没准哪天就发现gg了，毕竟你的钱冲的还不够～(￣▽￣～)(～￣▽￣)～嘿嘿嘿嘿

最后，送上旺仔儿童大礼包（环境判断方法，虽然也是百度的，但是省的找了，请叫我雷锋\(^o^)/~）

传送门

最后的最后，不当之处还请各路大牛多多指正~