H5页面如何唤醒app改进篇

看说明分为直接唤醒和点击唤醒。
<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<title>点击唤醒demo</title>
</head>
<body>
<style>
#zjmobliestart{font-size:40px;}
</style>

<!--
说明:通过h5可换醒app,如访问一个URL,点击按钮,打开应用,如果该应用APP没有安装,那么直接跳转到App Store的APP下载页面,通过点击的方式兼容性较好,如果安装了app,在手机各大浏览器(360浏览器 uc浏览器 搜狗浏览器 QQ浏览器 百度浏览器 )和QQ客户端中,能唤醒。微信 新浪微博客户端 腾讯微博客户端无法唤醒。
-->

<a href="zjmobile://platformapi/startapp" id="zjmobliestart" target="_blank">唤醒浙江移动手机营业厅!</a>

<script type="text/javascript">
function applink(){
    return function(){
        var clickedAt = +new Date;
         setTimeout(function(){
             !window.document.webkitHidden && setTimeout(function(){
                   if (+new Date - clickedAt < 2000){
                       window.location = ‘https://itunes.apple.com/us/app/zhe-jiang-yi-dong-shou-ji/id898243566#weixin.qq.com‘;
                   }
             }, 500);
         }, 500)
    };
}
document.getElementById("zjmobliestart").onclick = applink();
</script>
</body>
</html>

<!Doctype html>
<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<title>直接唤醒demo</title>
</head>
<body>
<style>
#zjmobliestart{font-size:40px;}
</style>

<!--
说明:通过h5可换醒app,如访问一个URL就能直接打开应用,如果该应用APP没有安装,那么直接跳转到App Store的APP下载页面
兼容性一般:在手机各大浏览器(360浏览器 uc浏览器 搜狗浏览器 QQ浏览器 百度浏览器 )能唤醒。微信 QQ客户端 新浪微博客户端 腾讯微博客户端无法唤醒。
-->

<p id="zjmobliestart">唤醒浙江移动手机营业厅!</p>

<script type="text/javascript">
function applink(){
    window.location = ‘zjmobile://platformapi/startapp‘;
        var clickedAt = +new Date;
         setTimeout(function(){
             !window.document.webkitHidden && setTimeout(function(){
                   if (+new Date - clickedAt < 2000){
                       window.location = ‘https://itunes.apple.com/us/app/zhe-jiang-yi-dong-shou-ji/id898243566#weixin.qq.com‘;
                   }
             }, 500);
         }, 500)   

}
applink();
</script>
</body>
</html>
时间: 2024-10-07 22:40:11

H5页面如何唤醒app改进篇的相关文章

怎样微信扫描二维码跳转页面,H5页面在微信中下载APP的实现方式

使用微信推广的用户经常都会遇到推广链接被拦截导致无法下载app的情况,此时用户在微信中打开会提示“ 已停止访问该网页 ”.这对于使用微信营销的商家来说就很不友好且损失非常大,因为用户是不知道为什么打不开的,商家不知道链接已被微信拦截,造成的结果就是用户大量流失,商家利益大量受损. 那么针对这个问题到底要怎么解决呢,其实只需要一个能实现微信内直接打开链接或跳转手机默认浏览器打开链接的功能,该功能实现后,如果你的链接含app文件则直接下载,如果不含则正常打开指定h5页面. 方案及实现效果 首先我们需

Hybrid APP基础篇(一)-&gt;什么是Hybrid App

说明 Hybrid APP是目前广泛流行的一种APP开发模式,本文对其做简单介绍 目录 前言 参考来源 楔子 Hybrid发家史 突然兴盛的H5 H5大行其道 H5渗入APP开发 Hybrid的兴盛 Hybrid概述 Hybrid定义 Hybrid App的类型划分 Hybrid架构 基本原理 内部的实现原理流程 Hybrid的未来 现行多种App开发模式以及分析比较 Hybrid面临的挑战 前言 参考来源 前人栽树,后台乘凉,本文参考了以下来源 HTML5 APP----2014年H5没火,w

html5页面打包成App - Android或Iphone安装程序

下载安装前端开发工具:HBuilder 官网下载:http://www.dcloud.io/ 根据官网说明安装 * 打开登录HBuilder,把做好的H5页面通过添加app项目把H5的文件夹加入进来(项目列表内会生成文件夹和文件如manifest.json) * 按Ctrl+R启动项目模拟,双击左侧项目列表的manifest.json配置相关参数 * 然后选择顶部菜单项‘发行’→‘App打包’→设置相关参数→上传云端打包好下载下来(可以选择打包成Android或Iphone安装包) * 发送手机

本地H5模式写的APP体验可以比APP还好

很多APP使用H5编写,但APP链接的是远程的url的模式,导致了APP的用户体验极差,因为当你使用远程的H5 url的时候,打开H5页面的速度由网络决定,而不是由手机性能决定,假如用户在没有网络的地方打开APP,甚至出现迟迟打不开APP界面,出现白色空白页的情况,造成用户一直在等待. 其实APP使用H5,不应该使用远程的H5 url,而是应该使用file://本地路径的方法打开本地的H5页面,而不是使用http://远程路径的方式打开H5页面,这样APP的打开速度就可以跟原生相比,因为这样打开

h5页面滑动卡顿解决方法

解决方式: 给滚动的元素加样式:-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling(允许独立的滚动区域和触摸回弹) 如果值为auto,就是普通的滚动,手指离开就停止滚动,让人感觉有点卡顿 如果设置为touch,在手指离开后还会滚一下,有回弹效果,看上去很流畅 但是刚开始用的时候有个小bug,h5页面打包成app时,一开始写成了*{-webkit-overflow-scrolling: touch;},导致滚动到最后页面底部出

iphoneX适配-客户端H5页面

由于iphoneX做了全面屏并且还保留一块小刘海,因此很多以前的移动端H5页面需要结合App客户端做出相应的适配,具体如下: 1.顶部通栏 之前的客户端一直采用状态栏20pt+导航栏44pt的做法.由于iphoneX多了一块小刘海,因此iphoneX单独采用状态栏44pt+导航栏44pt,意味着内嵌的H5页面整体下移24pt. 2.底部操作栏 由于iphoneX是全面屏,页面最底部会被弯曲的拐角截掉一部分,特别是有底部固定悬浮的tab条会严重受到影响.这时候需要底部留出一块空白安全区域,页面内容

如何判断一个APP页面是原生的还是H5页面

来源:http://www.25xt.com/appdesign/11851.html Hybrid APP指的是半原生半Web的混合类App.需要下载安装,看上去类似Native App,但只有很少的UI Web View,访问的内容是 Web . 原生是Native APP,H5就是Web App 在Hybrid 当中,如何快速的判断一个APP页面是原生的还是H5页面呢? 1.看断网的情况 把手机的网络断掉.然后点开页面.然后可以正常显示的东西就是原生写的. 显示404或则错误页面的是htm

利用浏览器调试APP中的H5页面

安卓手机的情况下,可以用chrome浏览器来调试. 打开地址: chrome://inspect/#devices 手机用USB数据线连接电脑,并启动USB调试模式. 只要在APP中打开H5页面,界面就会显示该页面地址 点击inspect进入调试模式 之后就可以像调试浏览器页面一样调试了. 这个方法也可以用来查看APP中哪些页面调用的是H5的页面. 苹果手机可以用Safari自带的调试工具调试,在Safari浏览器工具栏-开发一栏下.

5月20日重点:当请求的参数是动态的形式时,原生app与h5页面之间数据交互的方法

方案一: 1.app在打开H5页面的时候,把需要给的参数,以get的形式,放在H5的url中. 2.然后H5的js从url中获取到需要的参数,拼接到ajax请求的url中. 3.H5ajax请求,页面渲染. 方案二: 1.app方构建与H5交互的协议 2.H5写一个带参命名函数.在此方法内,填写数据获取后的操作代码. 并把函数名告知app方. 2.app方请求数据,然后以post方法,把请求到的全部数据传入已知的函数中,并调用此函数. 3.H5负责把接收到的数据,进行页面渲染. 注意:1.这个方