H5唤起app

1.判断是否在微信中打开

无论是在哪个平台的客户端Android/IOS,在微信的平台上访问都有一个问题,那就是无法启动客户端,这是微信为了安全性考虑的限制,android这边屏蔽schema协议,除非公司是微信的伙伴加入了白名单才能使用,IOS系统可以去访问app对应appstore的下载页,但是微信经常屏蔽appstore的这个网址,进而访问不到。比较方便的做法就是在微信浏览器中,无论是IOS还是android都去应用宝的下载(IOS 这边最后会到appstore中)页面打开。

var agent = navigator.userAgent || ''
var isWx = /micromessenger/i.test(agent)
if(isWx){
//微信,提示用户用浏览器打开
}else{
//非微信
}

js的test() 方法用于检测一个字符串是否匹配某个模式.

RegExpObject.test(string)
//string为要检测的字符串。
//如果字符串 string 中含有与 RegExpObject 匹配的文本,则返回 true,否则返回 false。

2.判断是否为iOS

var isIOS = /iPhone|iPad|iPod/i.test(agent)   //返回true/false

3.唤起app

H5启动APP本质上是通过URL scheme打开APP,一个APP可以设置一个或多个打开自己的URL scheme,浏览器去访问某一个APP的URL scheme,然后若系统安装有这个APP,则会请求权限去打开这个APP。

其实也算是浏览器app打开另一个app,iOS就可以使用 UIApplication 的 canOpenUrl 方法来检测URL scheme 是否能打开对应的APP,而android也是类似的方式。

当然如果JS跳转URL scheme没有反应,也意味着这个手机没有装这个app。

<a class='btn'>打开app</a>

如果需要跳转到app指定页面,在URL scheme后面再加一个url即可(URL scheme及url由app开发人员提供。)

if (isIOS) {
$('.btn').attr('href','BonDayApp://' + url);
} else {
$('.btn').attr('href','bondayapp://bonday.com/scheme?' + url);
}

H5唤起app的更多相关文章

  1. H5 唤起 APP的解决方案

    H5 页面唤起APP或跳转到下载APP的某个链接地址.总结如下: 在 IOS 中, 系统版本在 8 以下时,可以监听页面的 pagehide / visibilitychange 事件. 系统版本大于 ...

  2. h5唤起APP并检查是否成功

    // 检查app是否打开 function checkOpen(cb) { const clickTime = +(new Date()); function check(elsTime) { if ...

  3. h5 唤起app或跳转appStore

    //唤起app通过唤端媒介(URL Scheme)   //微信浏览器自6.3.x版本起禁用了大多数Scheme跳转功能,扫一扫目前可用   // URL 的组成:   // [scheme:][// ...

  4. H5唤起APP一些坑

    $(function () { function _openAppUrl(appUrl){ var ua = navigator.userAgent.toLocaleLowerCase(), open ...

  5. 简话h5唤起本地app

    在没接触这个功能之前,查询各种文档后也只是似懂非懂,做过之后,发现其实很简单,简言之就是通过一个iframe或者a标签来跳转app端提供的URL schema(至于这个URL schema的组成格式, ...

  6. H5如何实现唤起APP

    前言 写过hybrid的同学,想必都会遇到这样的需求,如果用户安装了自己的APP,就打开APP或跳转到APP内某个页面,如果没安装则引导用户到对应页面或应用商店下载.这里就涉及到了H5与Native之 ...

  7. 如何应用前端技术唤起app及判断用户来源及与原生交互的原理

    做唤起时需要native端进行配合, h5唤起app这种需求是常见的.在移动为王的时代,h5在app导流上发挥着重要的作用. 目前我们采用的唤起方式是url scheme(iOS,Android平台都 ...

  8. h5页面唤起app(iOS和Android),没有安装则跳转下载页面

    浏览器和app没有通信协议,所以h5不知道用户的手机释放安装了app.因此只能是h5去尝试唤起app,若不能唤起,引导用户去下载我们的app. 微信里屏蔽了 schema 协议,如果在微信中打开h5, ...

  9. h5移动网页唤起App

    最近这个困惑了很久,不断的有一些坑,目前还有疑问关于iOS唤起无效时会出现弹框的问题,这个最后再说 1.首先可能需要判断当前浏览器的来源(目前开发的App还没有上架,所以针对腾讯出品的大家广为人知的微 ...

随机推荐

  1. SQL事务回滚 写法(转)

    以下是SQL 回滚的语句:方案一:SET   XACT_ABORT   ON--如果产生错误自动回滚GOBEGIN   TRANINSERT   INTO   A   VALUES   (4)INSE ...

  2. vs2010 重新配置帮助文档

    1.VS2010帮助文件不支持重新配置,这个时候打开C:\Program Files\Microsoft Help Viewer\1.0目录,找到“HelpLibManager.exe.config” ...

  3. C#的Installer生成的msi的安装文件,安装新版本时提示:已经安装了该产品的另一个版本。无法继续安装此版本

    之前折腾了个C#的项目: WLW (Windows Live Writer) Plugin–InsertSkydriveFiles 然后又弄了个对应的Installer: [已解决]给一个C#的Dll ...

  4. Python-读入json文件并进行解析及json基本操作

      import json def resolveJson(path): file = open(path, "rb") fileJson = json.load(file) fi ...

  5. html5游戏开发-零基础开发《圣诞老人送礼物》小游戏

    开言: 以前lufy前辈写过叫“ HTML5游戏开发-零基础开发RPG游戏”的系列文章,在那里面我学习了他的引擎以及了解了游戏脚本.自从看了那几篇文章,我便对游戏开发有了基本的认识.今天我也以零基础为 ...

  6. Spark应用提交

    在 Spark 的 bin 目录中的 spark-submit 脚本用与在集群上启动应用程序.它可以通过一个统一的接口使用所有 Spark 支持的 Cluster Manager,所以您不需要专门的为 ...

  7. web Servlet 3.0 新特性之web模块化编程,web-fragment.xml编写及打jar包

    web Servlet 3.0 模块化 原本一个web应用的任何配置都需要在web.xml中进行,因此会使得web.xml变得很混乱,而且灵活性差,因此Servlet 3.0可以将每个Servlet. ...

  8. 最值得阅读学习的 10 个 C 语言开源项目代码

    1. Webbench Webbench是一个在linux下使用的非常简单的网站压测工具.它使用fork()模拟多个客户端同时访问我们设定的URL,测试网站在压力下工作的性能,最多可以模拟3万个并发连 ...

  9. HDU - 4871 Shortest-path tree (最短路径树+ 树分治)

    题意:给你一张带权无向图,先求出这张图从点1出发的最短路树,再求在树上经过k个节点最长的路径值,以及个数. 分析:首先求最短路树,跑一遍最短路之后dfs一遍即可建出最短路树. 第二个问题,树分治解决. ...

  10. spark streaming基础知识1

    1.怎么理解spark streaming中的dstream? 它是spark streaming的基础数据结构,代表着(time,RDD)序列,有两种生成方式,一种是基于流数据创建(kafka,so ...