H5唤起APP一些坑
$(function () {
function _openAppUrl(appUrl){
var ua = navigator.userAgent.toLocaleLowerCase(),
openBrowser = null,
deviceVersion = 0,
matchVersion = null,
openAppType = "",
downLoadUrl = 'http://pages.book.qq.com/pages/qidian/qddown/qdreader.htm';
//如果是在微信内部点击的时候
if(ua.indexOf("micromessenger") != -1 ){
_openAppUrl = function(){
alert("DEMO,请在移动端的浏览器查看!");
}
}else{
//在浏览器打开,判断是在移动端还是在PC端
if(matchVersion = navigator.userAgent.match(/OS\s*(\d+)/)){
//赋值,并且判断
//IOS设备的浏览器
deviceVersion = matchVersion[1] || 0;
if(deviceVersion - 9 >= 0){
openAppType = "newType";
}
}else if(matchVersion = navigator.userAgent.match(/Android\s*(\d+)/)){
//Android的设备
deviceVersion = matchVersion[1] || 0;
if(deviceVersion - 5 >= 0){
openAppType = "newType";
}
}else{
//PC端的设备
openAppType = "pc";
}
if(openAppType == "pc"){
_openAppUrl = function(){
alert("DEMO,请在移动端的浏览器查看!");
}
}else if(openAppType == "newType"){
//使用新的方法,尝试打开APP
//IOS>9,Android>5的版本
_openAppUrl = function(url){
var history = window.history,
body = $("body").eq(0),
ifr = $('<iframe class = "full-screen dn" style = "z-index:101;border:none;width:100%;height:100%;" src="'+downLoadUrl+'"></iframe>');
body.append(ifr);
$(window).on("popstate",function(e){
var state = history.state;
if(!state){
ifr.addClass("dn");
}
});
function _show(){
history.pushState({}, "下载APP链接页", "");
ifr.removeClass("dn");
}
_openAppUrl = function(url){
location.href = url;
_show();
}
_openAppUrl(url);
}
}else{
//使用计算时差的方案打开APP
var checkOpen = function (cb){
var _clickTime = +(new Date()),
_count = 0,
intHandle = 0;
//启动间隔20ms运行的定时器,并检测累计消耗时间是否超过3000ms,超过则结束
intHandle = setInterval(function(){
_count++;
var elsTime = +(new Date()) - _clickTime;
if (_count>=100 || elsTime > 3000 ) {
clearInterval(intHandle);
//计算结束,根据不同,做不同的跳转处理,0表示已经跳转APP成功了
if ( elsTime > 3000 || document.hidden || document.webkitHidden) {
cb(0);
} else {
cb(1);
}
}
}, 20);
}
_openAppUrl = function(url){
var ifr = document.createElement('iframe');
ifr.src = url;
ifr.style.display = 'none';
checkOpen(function(opened){
if(opened === 1){
location.href = downLoadUrl;
}
});
document.body.appendChild(ifr);
setTimeout(function() {
document.body.removeChild(ifr);
}, 2000);
}
}
}
_openAppUrl(appUrl);
}
var appUrl = "QDReader://";
$("#tryOpenApp").on("click",function(){
_openAppUrl(appUrl);
return false;
});
});
H5唤起APP一些坑的更多相关文章
- H5唤起app
H5唤起app 1.判断是否在微信中打开 无论是在哪个平台的客户端Android/IOS,在微信的平台上访问都有一个问题,那就是无法启动客户端,这是微信为了安全性考虑的限制,android这边屏蔽sc ...
- H5 唤起 APP的解决方案
H5 页面唤起APP或跳转到下载APP的某个链接地址.总结如下: 在 IOS 中, 系统版本在 8 以下时,可以监听页面的 pagehide / visibilitychange 事件. 系统版本大于 ...
- h5唤起APP并检查是否成功
// 检查app是否打开 function checkOpen(cb) { const clickTime = +(new Date()); function check(elsTime) { if ...
- h5 唤起app或跳转appStore
//唤起app通过唤端媒介(URL Scheme) //微信浏览器自6.3.x版本起禁用了大多数Scheme跳转功能,扫一扫目前可用 // URL 的组成: // [scheme:][// ...
- 简话h5唤起本地app
在没接触这个功能之前,查询各种文档后也只是似懂非懂,做过之后,发现其实很简单,简言之就是通过一个iframe或者a标签来跳转app端提供的URL schema(至于这个URL schema的组成格式, ...
- H5如何实现唤起APP
前言 写过hybrid的同学,想必都会遇到这样的需求,如果用户安装了自己的APP,就打开APP或跳转到APP内某个页面,如果没安装则引导用户到对应页面或应用商店下载.这里就涉及到了H5与Native之 ...
- 如何应用前端技术唤起app及判断用户来源及与原生交互的原理
做唤起时需要native端进行配合, h5唤起app这种需求是常见的.在移动为王的时代,h5在app导流上发挥着重要的作用. 目前我们采用的唤起方式是url scheme(iOS,Android平台都 ...
- h5页面唤起app(iOS和Android),没有安装则跳转下载页面
浏览器和app没有通信协议,所以h5不知道用户的手机释放安装了app.因此只能是h5去尝试唤起app,若不能唤起,引导用户去下载我们的app. 微信里屏蔽了 schema 协议,如果在微信中打开h5, ...
- h5移动网页唤起App
最近这个困惑了很久,不断的有一些坑,目前还有疑问关于iOS唤起无效时会出现弹框的问题,这个最后再说 1.首先可能需要判断当前浏览器的来源(目前开发的App还没有上架,所以针对腾讯出品的大家广为人知的微 ...
随机推荐
- WPF程序在Windows 7下应用Windows 8主题
这篇博客介绍如何在Windows 7下应用Windows 8的主题. 首先我们先看一个很常见的场景,同样的WPF程序(样式未重写)在不同的操作系统上展示会有些不同.这是为什么呢?WPF程序启动时会加载 ...
- 一个N*M的矩阵,找出这个矩阵中所有元素的和不小于K的面积最小的子矩阵
题目描述: 一个N*M的矩阵,找出这个矩阵中所有元素的和不小于K的面积最小的子矩阵(矩阵中元素个数为矩阵面积) 输入: 每个案例第一行三个正整数N,M<=100,表示矩阵大小,和一个整数K 接下 ...
- hdu 5073
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5073 思路:一开始忘了排序,wa了好几发...选择区间长度为N - K的连续的数, 然后其余的K个数都 ...
- 【转】hibernate缓存:一级缓存和二级缓存
什么是缓存? 缓存是介于物理数据源与应用程序之间,是对数据库中的数据复制一份临时放在内存中的容器,其作用是为了减少应用程序对物理数据源访问的次数,从而提高了应用程序的运行性能.Hibernate在进行 ...
- html学习第二天—— 第八章—— CSS选择器
标签选择器其实就是html代码中的标签.如右侧代码编辑器中的<html>.<body>.<h1>.<p>.<img>.例如下面代码:p{fo ...
- LINUX 查看当前系统的负载情况
uptime linux uptime命令主要用于获取主机运行时间和查询linux系统负载等信息. eg: # uptime 02:03:50 up 126 days, 12:57, 2 users, ...
- Delphi 各版本新特性功能网址收集
Delphi XE2 三个新功能介绍举例_西西软件资讯 http://www.cr173.com/html/13179_1.html delphi 2007新功能简介-davidxueer-Chin ...
- 【BO】WEBI文件打开时提示Illegal access错误
在infoview中打开WEBI文件时,提示如下错误. 通过查看SCN,找到错误原因是CMC中有一个服务没有启动. 启动这个服务即可: WebIntelligenceProcessingServer
- NOIp #2009
http://files.cnblogs.com/files/radiumlrb/NOIP2009%E6%8F%90%E9%AB%98%E7%BB%84%E5%A4%8D%E8%B5%9B%E8%AF ...
- CSS的Hack技术
主要是用来解决兼容性的特殊方法: IE都能识别*;标准浏览器(如FF)不能识别*: IE6能识别*,但不能识别 !important, IE7能识别*,也能识别!important,还有# FF不能识 ...