今天在做前端输出的时候，需要和app的做些对接工作。就是在手机浏览器中下载某app时，能判断该用户是否安装了该应用。如果安装了该应用，就直接打开该应用；如果没有安装该应用，就下载该应用。
那么下面就对在浏览器中，用js判断某用户是否安装了该应用，并判断是否打开该应用做个简单的介绍。
那么，怎么判断某用户是否安装了某应用呢？
在这里，先写段html代码，如下：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<a href="某app下载链接"></a>
</body>
</html>
判断手机端是否安装某应用，并打开该应用的js代码如下：
function isInstalled(){
var the_href=$(".down_app").attr("href");//获得下载链接
window.location="apps custom url schemes";//打开某手机上的某个app应用
setTimeout(function(){
window.location=the_href;//如果超时就跳转到app下载页
},500);
}
apps custom url schemes是什么
apps custom url schemes 是WAP端和APP端约定好的一个协议URL，如：
web2app://
和正常的URL一样，除了protocol部分外，也可以有host、path及参数，如：
web2app://openapp?type=1&id=12
具体要看各端约定，不过个人建议最好还是按照URL的组成规范来定义scheme，不然会引入由于URL不规范而导致的各种编码问题。
2.注册URL Scheme
安卓端：
（一般是在manifest.xml文件的activity的intent filter里面）
<span>
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data
android:scheme="**"
android:host="**.**"
android:pathPrefix="/**"> </data>
</intent-filter>
</span>
苹果端：
3.web 前端调用：
前端通过：
window.location="url schemes://";//打开某手机上的某个app应用
便可直接调用打开应用。
希望传参的话可以通过以下方式
window.location="URL Schemes://URL identifier";
//打开某手机上的某个app应用并传参URL identifier
以上介绍了怎么创建该本地协议及调用该本地协议的方法。但这里还有个关键就是怎么判断用户是否安装了该app呢？原理如下：
在手机浏览器中用js代码请求该协议，如果在500ms内，如果有应用程序能解析这个协议，那么就能打开该应用；如果超过500ms就跳转到app下载页。
URL Scheme存在的问题
IOS9.0以上弹确认框的问题。
在IOS9.0以上版本中，WAP端打开协议URL，如果已安装APP，会弹出如下图所示的确认框。
大部分情况下，用户点击“打开”APP之前，页面直接刷新跳转到WAP下载页，导致打开APP失败。这就是IOS9.0以上不能用scheme实现需求的主要原因。如果手机上未安装APP，WAP端打开协议URL，会弹出无效URL的弹窗，也会影响用户体验。
跳转下载页问题。
由于跳转到下载页由前端定时器触发，在所有的andriod机以及部分IOS机器上，打开APP后，WAP页还是会被定时跳转到下载页。
通用链接实现方案
什么是Universal Links(通用链接)?
这是iOS9推出的一项功能，如果你的应用支持Universal Links(通用链接)，那么就能够方便的通过传统的HTTP链接来启动APP(如果iOS设备上已经安装了你的app，不需要额外做任何判断等)，或者打开网页(iOS设备上没有安装你的app)。或许可以更简单点来说明，
在iOS9之前，对于从各种从浏览器，Safari、UIWebView或者 WKWebView中唤醒APP的需求，我们通常只能使用scheme。
具体实现方式请见
通用链接实现方案
网友评论