使用iframe从网页调起移动端应用
比如想在网页中调起支付宝,我们可以创建一个iframe,src为:
alipayqr://platformapi/startapp?saId=10000007&clientVersion=3.7.0.0718&qrcode={支付二维码扫描的url}
浏览器接收到这个url请求发现未知协议,会交给系统处理,系统就能调起支付宝客户端了。我们还能趁机检查一下用户是否安装客户端:给iframe设置一个3-5秒的css3的transition过渡动画,然后监听动画完成事件,如果用户安装了客户端,那么系统会调起,并将浏览器转入后台运行,进入后台的浏览器一般不会再执行css动画,这样,我们就能通过判断css动画执行的时长是否超过预设来判断用户是否安装某个客户端了:
/*** 调起客户端* @param url {String}* @param onSuccess {Function}* @param onFail {Function}*/module.exports=function(url, onSuccess, onFail){//记录起始时间var last =Date.now();//创建一个iframevar ifr = document.createElement('IFRAME');ifr.src=url;//飘出屏幕外ifr.style.position = 'absolute';ifr.style.left= '-1000px';ifr.style.top= '-1000px';ifr.style.width= '1px';ifr.style.height= '1px';//设置一个4秒的动画用于检查客户端是否被调起ifr.style.webkitTransition = 'all 4s';document.body.appendChild(ifr);setTimeout(function(){//监听动画完成时间ifr.addEventListener('webkitTransitionEnd', function(){document.body.removeChild(ifr);if(Date.now() - last < 6000){//如果动画执行时间在预设范围内,就认为没有调起客户端if(typeof onFail === 'function'){onFail();}}else if(typeof onSuccess === 'function') {//动画执行超过预设范围,认为调起成功 onSuccess();}},false);//启动动画ifr.style.left = '-10px';},0); };
转载于:https://www.cnblogs.com/elexiang/p/4700763.html
使用iframe从网页调起移动端应用相关推荐
- html5程序自动登录,Jtro的技术分享:网页调起unity的exe程序并自动登录
思路是这样:通过一个额外的exe文件来实现登录,并保存一个token文件,然后在unity的项目提交数据的时候读取这个token向服务器发送数据. 下面是具体的方法: s 这个需要用到WPF来编写,首 ...
- 微信公众平台使用JSSDK网页调起扫码并获取扫码数据(PHP)
微信公众平台使用JSSDK网页调起扫码并获取扫码数据 初学者,部分css样式在网上扒下来的,功能实现了,代码很糙,非常糙,望海涵,也希望大神多指导. QQ:961052877,有问题大家一起交流.可以 ...
- html天气插件iframe,分享常用7款天气预报代码iframe嵌入网页方式
如果在网站上加入天气预报功能,你找不到更好的天气预报代码,可以看下本站和大家分享的7款天气预报代码iframe嵌入网页方式. 天气预报代码1 src='http://appnews.qq.com/cg ...
- 网页游戏mysql修改_大天使之剑奇迹网页游戏 一键服务端+架设教程+修改方法
大天使之剑奇迹网页游戏 一键服务端+架设教程+修改方法 实施教程: 1.将user的ver和phpStudy文件夹等文件解压到磁盘上给你的目录中.示例:d 3360 \\ muser版本d: \\研究 ...
- iframe嵌入网页时,页面大小怎么自适应
问题描述: 页面中有一容器div,有宽高属性.在div中嵌入一个iframe页面,呈现这种效果: 可以看到嵌入的页面只露出了一部分. 而我们希望:嵌入的页面能够完整无遮挡的展示在容器中. 整体思路:利 ...
- html天气插件iframe,HTML_利用iframe在网页中显示天气附效果截图,css: 复制代码代码如下: *{margi - phpStudy...
利用iframe在网页中显示天气附效果截图 css: 复制代码代码如下: *{margin:0;padding:0;list-style-type:none;} a,img{border:0;} bo ...
- Unity导出的WebGL、网页前端、服务端以及硬件四级交互结构的实现(简单3d建模网页端物联网)
本文代码基于一个智慧楼宇项目: 前提:(Unity应该使用尽量最新的版本,2020年的应该就行,2019年的未知',2018年的好像就不行了) 模式简介: 1.服务端处理楼宇发送的信息,把处理过的信息 ...
- C# -爬虫之WebBrowser跨域跨iframe获取网页源码
前言:这里关键写用WebBrowser跨域跨iframe获取网页源码的部分,本意是要爬取全职高手的有声小说,这类网站特殊,网页上广告大堆,爬起来真麻烦,比如我爬取的网站的mp3源文件下载还需要秘钥的, ...
- 用IFRAME实现网页的内嵌和预载
用IFRAME实现网页的内嵌和预载 在HTM(HTML)文件中是否可以像PHP.ASP文件一样嵌入其他文件呢?下面笔者介绍用iframe来实现的方法. iframe元素的功能是在一个文档里内嵌一个文档 ...
最新文章
- wchar用wcout输出正常cout是?
- MySQL 用户与授权管理详解
- 8月第3周回顾:四巨头发三大新闻 一报告引多家争议
- 羊皮卷的故事-第二章
- 函数 —— fork()分叉函数
- drcom宽带认证登录超时_开发SSO单点登录需要注意的问题
- u-boot.lds详细的分析
- how I can force redetermination everytime
- 51nod 1250 排列与交换——dp
- 源码安装mysql数据库_Linux下源码安装mysql数据库
- 全开源纵横支付多平台多功能支付系统源码
- Nancy跨平台开发总结(六)三层架构之Token认证的Rest API
- 第4代计算机的cpu,世界最小电脑进化第四代:继续用APU
- 48条高效率的PHP优化写法
- 【广工考试笔记】计算机系统结构考试速成笔记
- 快速开发微信小程序直播--微信直播--小程序直播开发
- 基于STM32的NRF24L01模块一对一的问题记录
- 分解质因数FZU - 1075
- 孙鑫老师的程序员之家
- 给你的亲人一个科技感满满的生日祝福吧