zoukankan      html  css  js  c++  java
  • HTML中判断手机是否安装某APP,跳转或下载该应用

    有些时候在做前端输出的时候,需要和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下载页。

  • 相关阅读:
    golang框架对比Revel and Beego
    Gin框架系列02:路由与参数
    用cp命令拷贝文件,源目录后带不带斜杠的区别
    Isilon Gen6的换盘步骤
    如何在同一行里执行多个linux命令?
    KB,MB,GB,TB,PB,EB,ZB,YB,BB
    Isilon的WebUI上指定跨时区时间的小问题
    用Powershell强制同步Windows主机与Internet time server的时间
    Remote Desktop突然不能用了 “This could be due to CredSSP encryption oracle remediation”
    打开KVM Console的一些注意事项
  • 原文地址:https://www.cnblogs.com/susanws/p/6274642.html
Copyright © 2011-2022 走看看