有些时候在做前端输出的时候,需要和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);
}

下面对这段js代码做一个简单的解析:首先试着打开手机端某个app的本地协议;如果超时就转到app下载页,下载该app。

说到这里,有人就要问了,这个本地协议又是怎么建立的呢?好了,下面也就这个做个简单的介绍:

其实就是在app中将http协议转换为本地协议,具体怎么转换,不在本讨论范围。但需要在app里面对配置文件做一下设置(一般是在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>

apps custom url schemes是什么呢?

其实就是你与app约定的一个协议URL,在iOS客户端或者Android客户端中可以设置一个URL Scheme。例如,设置URL Scheme:app,然后其他的程序就可以通过“ URLString=app://”调用该应用。还可以传参数,如:app://reaction/?uid=1

以上介绍了怎么创建该本地协议及调用该本地协议的方法。但这里还有个关键就是怎么判断用户是否安装了该app呢?原理如下:

在手机浏览器中用js代码请求该协议,如果在500ms内,如果有应用程序能解析这个协议,那么就能打开该应用;如果超过500ms就跳转到app下载页。

HTML中判断手机是否安装某APP,跳转或下载该应用的更多相关文章

  1. ios开发判断手机是否安装微信app

    1.代码如下 if ([WXApi isWXAppInstalled]) 2.如果以上代码无效,请在plist文件中添加如下内容

  2. 利用RxJava获取手机已安装的App的图片、应用名称和版本号

    先上效果图: 获取手机已安装的App列表利用Android系统API就可以办到,这里为什么要引入RxJava?现在我们假设一下有下面几个需求: 1.我们不需要所有的App,只需要用户安装的第三方App ...

  3. 浏览器网页判断手机是否安装IOS/Android客户端程序

    IOS 原理如下: 为HTML页面中的超链接点击事件增加一个setTimeout方法. 如果在iPhone上面500ms内,本机有应用程序能解析这个协议并打开程序,则这个回调方法失效: 如果本机没有应 ...

  4. Android中获取系统上安装的APP信息

    Version:0.9 StartHTML:-1 EndHTML:-1 StartFragment:00000099 EndFragment:00003259 Android中获取系统上安装的APP信 ...

  5. js判断手机是否安装了某一款app,有则打开,没有去下载

    function openApp(){ if(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) { var loadDateTime = new ...

  6. 如何用js检测手机是否安装某个app

    问题描述 如果本地安装了app那么直接打开,否则苹果要跳转到app-store,安卓则要跳到对应的市场 解决方案 一 //html代码中 的 a 标签,以微信为例,默认的是调用weixin schem ...

  7. 点击app分享链接,js判断手机是否安装某款app,有就尝试打开,没有就下载

    html: <h1 class="downlink"> 前往 </h1> js: document.addEventListener('DOMContent ...

  8. android检测手机是否安装某个app

    public static boolean isAvilible(Context context, String packageName){ //获取packagemanager final Pack ...

  9. mac 上如何安装非app store上的下载的软件-------打开未知来源

    打开了 Terminal 终端后 ,在命令提示后输入 sudo spctl --master-disable 并按下回车执行,如下图所示.   随后再输入当前 Mac 用户的密码,如下图所示.   如 ...

随机推荐

  1. HTML5学习+javascript学习:打飞机游戏简介以及Model层

    本着好记性不如烂博客以及分享成功的喜悦和分享失败的苦楚,今天我来分享下一个练手项目:打飞机游戏~从小就自己想做游戏,可是一直没有机会.HTML5给了我们这个平台,这个平台可以有很多以前想都不敢想的东西 ...

  2. 乔布斯,TED,我的演讲

    乔布斯传这部独立影片虽然以失败告终,但是人们把期待留给了索尼影业即将投拍的官方乔布斯传记电影. 据传,这部影片将以乔布斯最成功的四次演讲作为主线,这无疑说明,演讲,对于乔布斯这个传奇人物,是非常重要的 ...

  3. 各浏览器的cookie的name个数/最大容量限制测试

    测试代码 for(var ii = 0; ii< 5000;ii++){ if (!window.ia) window.ia=0; window.ia++; var s = 'a'+window ...

  4. 使用DOM4J解析XML文档,以及使用XPath提取XML文档

    使用DOM4J解析XML文档 需要首先下载DOM4J工具包.这是个第三方工具包 在使用DOM4J解析的时候需要导入 DOM4J的JAR包 下载DOM4J工具包->在MyEclipse中新建lib ...

  5. linux下搭建svn本地服务器

    在linux下搭建svn本地服务器可以很好的管理自己的代码,具体过程如下: # mkdir svn_local # cd svn_local  # svnadmin create led_diplay ...

  6. html - table 表格不被撑开,td某些列宽度固定某些列自适应

    table-layout 属性的解释:http://www.w3school.com.cn/cssref/pr_tab_table-layout.asp 1,实现table细边框,设置如下css: t ...

  7. 编译 MVC View

    默认MVC的 View页面 不参与编译,当更改view对应model后,view编译也能通过,或者页面有错误的服务端代码时也不会报错. 那么如何在编译的时候能让View中的错误也不能通过呢.经过查找找 ...

  8. 2017 年不可错过的开发工具 Top 50

    想知道 2017 年有哪些值得关注的开发工具吗?StackShare 年度开发工具排行榜来啦! StackShare.io 是一个开发者工具及服务分享平台,致力于发现并分享开发者使用的开发工具.服务与 ...

  9. android 在5.0以后不允许使用隐式Intent方式来启动Service

    android5.0以后不能使用隐式intent :需要指定Intent的ComponentName信息:intent.setComponent(xxx),或指定Intent的setPackage(& ...

  10. vim 模式基础操作

    作者:枫雪庭 出处:http://www.cnblogs.com/FengXueTing-px/ 欢迎转载 前言 虽然Emacs已经可以完成大部分的编辑操作,但有时候为了方便也会用到vim.所以记录了 ...