在web浏览器中判断app是否安装并直接打开
最近公司App产品在运营推广上有一个需求，就是要求可以让用户在访问我们的推广网页时，就可以判断出这个用户手机上是否安装了我们的App，如果安装了则可以直接在网页上打开，否则就引导用户前往下载。从而形成一个推广上的闭环。
在iOS上，其实只需要在<head>标签内增加一个<meta>标签，系统就会自动帮你在顶部生成一个Banner，而且会智能引导用户操作（如果未安装就跳转AppStore，否则直接打开）。格式如：<meta name='apple-itunes-app' content='app-id=你的APP-ID'>。比如加一个百度贴吧的Native APP大Banner，用下面这串儿代码：
<meta name='apple-itunes-app' content='app-id=477927812'>
但是上面的方法仅限于iOS设备，且无法定义Banner的形式。另外打开应用时也无法告诉App端要做什么操作。（因为后来运营有提出了新的需求，比如在推广网页上打开的App就直接进行某项操作。）
那么，我们可以通过另外一种协议的方式来达到上述要求的效果，即：
1.可以在web页面中直接打开App。
2.打开App的同时可以进行传值操作，告诉移动端程序应该做什么。
前提：知道你的App对应的打开协议。例如百度贴吧的协议为：com.baidu.tieba://，微信的协议为：weixin://，等等。
方法一：
function runApp(rid) {
var state = null;
try {
state = window.open("myapp://jest.app/openwith?id=" + rid, '_self');
} catch (e) {
alert("发生未知错误:" + state + ",请联系运营商.");
}
}
方法一直接利用window.open的方式来打开应用，rid是要告诉移动端的值，这里只写了一个，大家可以根据实际情况来定义自己的参数。打开方式这里定义为_self，是因为如果是_blank的话，会重新打开一个选项卡， 不是很友好。 另外这个方法对于Andriod设备的兼容性不是很好， 不建议在Andriod设备上执行此方法。
方法二：
function runApp2(rid) {
var ifrSrc = "myapp://jest.app/openwith?id=" + rid;
var ifr = document.createElement('iframe');
ifr.src = ifrSrc;
ifr.style.display = 'none';
document.body.appendChild(ifr);
// 点击后延时触发清除iframe，并跳转页面
setTimeout(function () {
document.body.removeChild(ifr);
}, 200);
}
方法二是利用iframe的方式来进行打开，同样rid是要传递的参数。这个方法我测试了一些Andriod设备，感觉还是比较好的。 但是iOS体验较差， 建议大家自己根据实际情况，结合使用。
最后说下关于没有安装App时的处理方法。基本上网上大家搜的打开方式都是通过协议的方式， 那么如果用户在触发打开条件后， 一定时间内没有打开应用，我们就可以确定该用户是没有安装对应的App。 那么我们可以通过延时函数来进行后续的引导操作。
在web浏览器中判断app是否安装并直接打开的更多相关文章
- 在手机浏览器中判断App是否已安装
从网上搜到之前手机中判断App是否安装可以通过onblur事件+定时器来实现. 但现在要做这个功能时,按网上的说法已经不能实现了.因为现在浏览器中打开App,window不会触发onblur事件. 在 ...
- 第十一章：WEB浏览器中的javascript
客户端javascript涵盖在本系列的第二部分第10章,主要讲解javascript是如何在web浏览器中实现的,这些章节介绍了大量的脚本宿主对象,这些对象可以表示浏览器窗口.文档树的内容.这些章节 ...
- JavaScript权威指南--WEB浏览器中的javascript
知识要点 1.客户端javascript window对象是所有客户端javascript特性和API的主要接入点.它表示web浏览器的一个窗口或窗体,并且可以用window表示来引用它.window ...
- HTML中判断手机是否安装某APP，跳转或下载该应用
有些时候在做前端输出的时候,需要和app的做些对接工作.就是在手机浏览器中下载某app时,能判断该用户是否安装了该应用.如果安装了该应用,就直接打开该应用:如果没有安装该应用,就下载该应用.那么下面就 ...
- 浏览器网页判断手机是否安装IOS/Android客户端程序
IOS 原理如下: 为HTML页面中的超链接点击事件增加一个setTimeout方法. 如果在iPhone上面500ms内,本机有应用程序能解析这个协议并打开程序,则这个回调方法失效: 如果本机没有应 ...
- websocketj--随时随地在Web浏览器中操作你的服务端程序
0 - 有没有觉得Linux标准终端界面输入输出枯燥无味? 1 - 什么?vmstat命令的输出数据不直观?有没有想过能够可视化该命令的输出? 2 - 尝试过用浏览器操作Windows中的cmd吗? ...
- web浏览器中javascript
1.异步载入一个js代码function loadasync(url) { var head = document.getElementsByTagName("head")[0]; ...
- web浏览器中的javascript -- 2
在html里嵌入javascript: 在html文档里嵌入客户端javascript代码有4种方式: 1.内联,放置在<script>和</script>标签对之间; 2.放 ...
- IE浏览器中判断IE版本
<!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]--><!--[if IE]> 所有的IE可识别 <![e ...
随机推荐
- DELPHI XE7 新的并行库
DELPHI XE7 的新功能列表里面增加了并行库System.Threading, System.SyncObjs. 为什么要增加新的并行库? 还是为了跨平台.以前要并行编程只能从TThread类继 ...
- UVA 839 (13.08.20)
Not so Mobile Before being an ubiquous communications gadget, a mobile wasjust a structure made of ...
- http2.0笔记
二进制分帧层 定义了如何封装 HTTP 消息并在客户端与服务器之间传输 http2.0的消息传输特点: 流 已建立的连接上的双向字节流 消息 与逻辑消息对应的完整的一系列数据帧 帧 http2.0通信 ...
- 内网穿透神器ngrok(转)
相信做Web开发的同学们,经常会遇到需要将本地部署的Web应用能够让公网环境直接访问到的情况,例如微信应用调试.支付宝接口调试等.这个时候,一个叫ngrok的神器可能会帮到你,它提供了一个能够在公网安 ...
- HDU 3853 期望概率DP
期望概率DP简单题 从[1,1]点走到[r,c]点,每走一步的代价为2 给出每一个点走相邻位置的概率,共3中方向,不动: [x,y]->[x][y]=p[x][y][0] , 右移:[x][y ...
- vc2008构建和使用libcurl静态库
1>下载CURL源代码curl-7.26.0.zip 2>用VC2008/2005打开工程curl-7.26.0\lib\libcurl.vcproj,转换下工程并构建,可以直接编译成功! ...
- Android WebView挂马漏洞--各大厂商纷纷落马
本文章由Jack_Jia编写,转载请注明出处. 文章链接: http://blog.csdn.net/jiazhijun/article/details/11131891 作者:Jack_Jia ...
- webmagic加上了注解支持
今天有个网友在博客回帖,能不能用注解来写一个爬虫?想了想,因为Javaer总习惯结果有个对象Model(我在自己用的时候也是这样),ResultItems的key-value形式难免会有点麻烦,何不将 ...
- 用VBA宏从一个工作薄复制内容到另一个工作薄
我们项目管理有两个工作薄,一个里面有多个表,每天建一个,记录当天项目,另一个工作薄,有多个表,其中一个是所有项目汇总. 以前都是第一个工作薄一个表做完,再复制粘贴到第二个工作薄的汇总表中. 写了个VB ...
- Android APP代码拨打电话、打开手机分享功能等隐式意图
Android APP拨打电话: Intent intent=new Intent(Intent.ACTION_DIAL,Uri.parse("tel:"+110)); start ...