产品需求:分享出去的链接比如到微信朋友圈,微博的H5页面,添加一个按钮 open App 用来打开并启动自己公司的APP (如果当前手机已经安装自己公司的APP)

废话少说直接上代码:

<input type="button" value="从APP打开" onClick="openApp();">

<script language="javascript">
function openApp(){
var schemeUrl = 'app里即有的协议如: apps custom url schemes ';
if (navigator.userAgent.match(/(iPhone|iPod|iPad)/i)) {
var loadDateTime = new Date();
window.setTimeout(function() {
var timeOutDateTime = new Date();
if (timeOutDateTime - loadDateTime < 5000) {
   window.location.href = '没安装APP时要跳转的链接';
} else {
alert('无法打开');
}
},25);
window.location.href = schemeUrl;
} else if (navigator.userAgent.match(/android/i)) {
var state = null;
try {
state = window.open(schemeUrl, '_blank');
} catch(e) {}
if (state) {
alert('无法打开');
window.close();
} else {
window.location.href = '没安装APP时要跳转的链接';
}
}
}
</script>

apps custom url schemes 是什么呢?
其实就是你与APP约定的一个协议URL,你的IOS同事或Android同事在写程序的时候会设置一个URL Scheme,

例如设置: URL Scheme :app
然后其他的程序就可以通过   URLString = app:// 调用该应用。

还可以传参数,如:app://reaction/?uid=1
原理:500ms内,本机有应用程序能解析这个协议并打开程序,调用该应用;如果本机没有应用程序能解析该协议或者500ms内没有打开这个程序,则执行setTimeout里面的function,就是跳转到你想跳转的页面。

WebApp JS 打开 app的更多相关文章

  1. js 打开app应用,如果没有安装就去下载

    废话不多说,直接上代码 var APPCommon = { iphoneSchema: 'XingboTV://', iphoneDownUrl: 'https://itunes.apple.com/ ...

  2. 通过JS唤醒app(安卓+ios)

    有需求说要通过页面按钮唤醒app,或者手机上没有这款app跳转到商店,然后刚开始也是查了资料的,结果发现一头雾水,不过最后还是捣鼓出来了,当然也参考了前人分享的经验,下面我就将方法整理一下: 首先明确 ...

  3. 微信扫描打开APP下载链接提示代码优化

    上一次我发了一篇文章叫“微信打开网址添加在浏览器中打开提示”,里面我发出来了三个代码,分别是纯JS.js+html.jQuery+HTML代码.今天来一个简化版带可以关闭的按钮操作.使用的是纯JS+H ...

  4. 微信扫描打开APP下载链接提示代码优化(转)

    上一次我发了一篇文章叫“微信打开网址添加在浏览器中打开提示”,里面我发出来了三个代码,分别是纯JS.js+html.jQuery+HTML代码.今天来一个简化版带可以关闭的按钮操作.使用的是纯JS+H ...

  5. 实现微信浏览器内打开App Store链接(已被和谐,失效了)

    微信浏览器是不支持打开App Store 页面的,不知道微信为什么这么做.比如你页面写 <a href=”http://itunes.apple.com/us/app/id399608199″& ...

  6. webapp检测安卓app是否安装并launch

    1. cordova插件 1)查看所有已安装的安卓app https://www.npmjs.com/package/cordova-plugin-packagemanager A simple pl ...

  7. WebApp与Native App有何区别

    转:http://blog.sina.com.cn/s/blog_5f2df1e401018hjj.html 今天看的一篇关于html5的Web App与Native App的技术分析,真的很棒分享一 ...

  8. JS调用App方法及App调用JS方法

    做App内嵌H5项目时,经常会遇到js与App的交互,最普遍的就是方法的互相调用,那么如何实现方法的互相调用呢? 写在前面: 如果只是小项目且后期扩大的可能性不大的时候,可以忽略,可如果是长期项目的话 ...

  9. 关于Vue中main.js,App.vue,index.html之间关系进行总结

    在初始化的Vue项目中,我们最先接触到的就是main.js,App.vue,index.html这三个文件,我们从培训视频或者官方文档上可以了解到: index.html---主页,项目入口 App. ...

随机推荐

  1. Flash Builder 4.6 BUG 远程访问受阻

    今天调试项目的时候,惊讶的发现在使用RemoteObject进行远程访问时出现奇怪现象,只能在服务器本地实现访问,在其他客户机上提示2048错误,send failed,差点没把我吓死,记得之前测试过 ...

  2. ceph--磁盘和rbd、rados性能测试工具和方法

    我在物理机上创建了5台虚拟机,搭建了一个ceph集群,结构如图: 具体的安装步骤参考文档:http://docs.ceph.org.cn/start/ http://www.centoscn.com/ ...

  3. PMP考试--三点估计法

    如果你对项目管理.系统架构有兴趣,请加微信订阅号“softjg”,加入这个PM.架构师的大家庭 把施工时间划分为乐观时间.最可能时间.悲观时间 乐观时间:也就是工作顺利情况下的时间为a 最可能时间:最 ...

  4. 将U盘分成 启动盘+文件存储区

    我看了很多帖子,发现想要将U盘分区的朋友绝大部分是和我一样,想用U盘做成一个启动盘同时兼顾文件存储,分区的目的很简单,就是想将启动部分单独做成一个区,以免在日常的应用中使得启动文件染毒或者误操作造成损 ...

  5. windows 创建服务提示失败 5 拒绝 访问拒绝

    1.桌面创建文本,输入 sc create .....echo. & pause 保存,重命名为   .bat 2.右键该文件,管理员运行

  6. USACO Section 2.2 循环数 Runaround Numbers

    OJ:http://www.luogu.org/problem/show?pid=1467 #include<iostream> #include<vector> #inclu ...

  7. TCP/IP详解学习笔记(7)-- 初识运输层

    作为TCP和UDP协议的学习前奏,简单的介绍一下运输层的相关内容,方便对TCP,UDP的学习. 1.概述      运输层的任务主要是负责主机中两个进程之间的通信.      运输层的基本功能: 复用 ...

  8. C# 特性 Attribute

    特性就是在类的类名称.属性.方法等上面加一个标记,使这些类.属性.方法等具有某些统一的特征,从而达到某些特殊的需要.举个小栗子:方法的异常捕捉,你是否还在某些可能出现异常的地方(例如数据库的操作.文件 ...

  9. json对象与字符串互转

    javascript 1 JSON.parse() 方法用于将一个 JSON 字符串转换为对象. JSON.parse(text[, reviver]) text:必需, 一个有效的 JSON 字符串 ...

  10. 【缓存】利用Cache防止同一帐号重复登录

    需求概要 对于B/S应用系统中客户经常会提出同一帐号不能重复登录的需求,就是说,用某一帐号登录系统后,在系统不超时的情况下,任何人都不能再用目前已登录的帐号登录系统.包括我目前的项目中同样有这一需求. ...