背景最近在用js引出微信、QQ、微博中的App。以前做过类似的功能，但是比较粗糙，没有考虑到情况。太全面了，那是很久以前的事了。许多技术已经过时。现在有唤起技术，体验更好，功能更全。很多以前的解决方案现在都不需要了。现在通过本文与大家分享一个全面最新的觉醒解决方案，希望对大家有所帮助。最终效果是用户在H5页面点击打开应用或下载按钮（这个按钮可能在下载入口页面，各种分享页面的顶部或底部banner），如果用户已经安装了应用，根据业务跳转到对应的Native页面；如果用户还没有安装应用，请跳转到应用商店或应用市场下载我们的应用。申请流程首先所有的下载/唤醒入口都是直接跳转，应该是这样的：下载或者这样：窗户。location.href='https://applink-party.mtime.cn/mtlf'所有的业务判断都在mtlf页面进行，有两个好处：多业务共享代码。在一个团队中，每个人的业务可能都有一个横幅可以下载。没有比定位到url更简单的调用方法。可以用万能链接简单说一下万能链接的优点。iOS9之前，调用方式与现在Android相同。一种是使用方案唤醒。这种方法有一个小问题。每次唤醒都会提示：是否打开xx应用。通用链接会直接跳转，不会停留在页面上。条件是在我们项目的根目录下添加一个apple-app-site-association.json文件。里面的内容大致是这样的：然后配置iOSApp后台一键直接调出！如何在H5端配置万能链接才算成功？只要我们在浏览器中打开某个url（不管是cdn地址还是路由转发），看到json文件的内容，就认为H5的配置成功了。然后把这个地址给iOS老司机，告诉他们怎么做，他们马上就知道怎么做了，就这么简单！微信、微博、QQ、Safari在各平台的唤醒方案经过长时间的实验，我们总结了各种情况下唤醒成功/失败的解决方案，下面一一说说。微信微信是最重要的分享渠道，但我们能做的不多。之前iOS下的微信是支持万能链接的，但是从2018年1月8日起，微信屏蔽了这个！！！不管微信是什么原因，要屏蔽iOS下最方便的唤醒方式，我们能做的就是适应。所以，现在无论是iOS还是Android，我们的处理方式都是一样的：直接跳转到AppStore。iOS版AppStore会引导您打开AppStore，Android版AppStore会直接打开App（前提是您已经下载）。这座桥。微博微博目前也支持万能链接唤起，我们只需要考虑不下载的情况。iOS下，微博不支持打开应用宝的链接，所以我们需要引导用户使用Safari打开，像这样：android平台下，使用scheme的方法无法调用应用，但有特殊情况，同样的方案，成人评论和网易云音乐都可以被唤起，有空可以自己试试，所以我们可以推断，Android平台下的微博也有类似微信的白名单，白名单里的可以使用scheme唤起，就像微信之于京东，京东在微信中被scheme唤起。所以，不管是iOS还是Android，我们的解决方案是：直接引导用户用本地浏览器打开。QQiOS平台下，QQ目前支持万能链接激活。如果没有安装，QQ也支持直接打开itunes链接。与其他应用程序相比，QQ支持是最好的。在android平台，QQ也支持scheme激活，但是在一些老机型中，QQ激活有一定概率会失败。根据现象，我们可以推断在QQwebview中，调用scheme的方式会有一些加载时间限制。经测试，约为500ms。如果时间超过这个值，唤起就会失败。之所以第二次打开唤起成功的概率较高，是因为第一次加载时文件已经缓存，第二次打开直接加载，所以时间在限制之内。SafariSafari本例比较简单，支持万能链接，也支持直接打开itunes，所以，如图处理即可。在iOS9中，Safari不支持直接跳转到itunes，所以在这种情况下，需要进行兼容处理。可以直接跳转到AppStore查看是否激活成功。你需要自己计算时间，因为如果激活成功，setInterval的时间会变慢。经过我的测试，这个方法已经不用了。你只需要使用document.hidden||document.webkit隐藏。兼容性还不错。UA里面有这样的字符串吗？经过测试，发现AndroidUA中也包含了Safari字符串（如下图UA所示），所以需要操作系统进行判断。之前有很多解决方案，比如：使用iframe，标签点击，window.location...经过测试，只要点击a标签，兼容性最好，代码如下：关于测试两个平台，这么多情况，要不要一一测试？当然需要一一验证，但是在开发期间，不用换一根线，在手机上测试，效率太低了，尤其是选择安卓4.4的手机，你绝对可以磨练你的耐心。为了提高效率，把我经常用到的UA分享给大家，方便大家在Chrome模拟器中配置，本地调试。常用的UA如下：iOS-WeChatMozilla/5.0(iPhone;CPUiPhoneOS11_2_2likeMacOSX)AppleWebKit/604.4.7(KHTML,likeGecko)Mobile/15C202MicroMessenger/6.6.1NetType/WIFILanguage/zh_CNiOS-QQMozilla/5.0(iPhone;CPUiPhoneOS11_2_2likeMacOSX)AppleWebKit/604.4.7(KHTML,likeGecko)Mobile/15C202QQ/7.3.5.473V1_IPH_SQ_7.3.5_1_APP_APixel/1125Core/UIWebViewDevice/Apple(iPhoneX)NetType/WIFIQBWebViewType/1iOS-WeiboMozilla/5.0(iPhone;CPUiPhoneOS11_2_2likeMacOSX)AppleWebKit/604.4.7(KHTML,likeGecko)Mobile/15C202微博(iPhone10,3__weibo__8.1.0__iphone__os11.2.2)iOS-safariMozilla/5.0(iPhone;CPUiPhoneOS11_2_2likeMacOSX)AppleWebKit/604.4.7(KHTML,likeGecko)Version/11.0Mobile/15C202Safari/604.1Android-WeChatMozilla/5.0(Linux;Android4.4.2;PE-TL20Build/HuaweiPE-TL20;wv)AppleWebKit/537.36(KHTML,likeGecko)Version/4.0Chrome/57.0.2987.132MQQBrowser/6.2TBS/043807MobileSafari/537.36MicroMessenger/6.6.1.1220(0x26060135)NetType/WIFILanguage/zh_CNAndroid-QQMozilla/5.0(Linux;Android4.4.2;PE-TL20Build/HuaweiPE-TL20;wv)AppleWebKit/537.36(KHTML,likeGecko)Version/4.0Chrome/57.0.2987.132MQQBrowser/6.2TBS/043807MobileSafari/537.36V1_AND_SQ_7.3.2_762_YYB_DQQ/7.3.2.3350NetType/WIFIWebP/0.3.0Pixel/1080Android-WeiboMozilla/5.0PE(Linux;Android4.4.2;-TL20Build/HuaweiPE-TL20)AppleWebKit/537.36(KHTML,likeGecko)Version/4.0Chrome/30.0.0.0MobileSafari/537.36Weibo(HUAWEI-PE-TL20__weibo__8.0.2__android__android4.4.2)同理，在电脑上切换环境：源码和库文件使用请参考：Github，长按我扫码验证整个激活过程，可以访问这个下载入口：https://party.mtime.cn/download也可以扫码：
