比如想在网页中调起支付宝,我们可以创建一个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从网页调起移动端应用相关推荐

  1. html5程序自动登录,Jtro的技术分享:网页调起unity的exe程序并自动登录

    思路是这样:通过一个额外的exe文件来实现登录,并保存一个token文件,然后在unity的项目提交数据的时候读取这个token向服务器发送数据. 下面是具体的方法: s 这个需要用到WPF来编写,首 ...

  2. 微信公众平台使用JSSDK网页调起扫码并获取扫码数据(PHP)

    微信公众平台使用JSSDK网页调起扫码并获取扫码数据 初学者,部分css样式在网上扒下来的,功能实现了,代码很糙,非常糙,望海涵,也希望大神多指导. QQ:961052877,有问题大家一起交流.可以 ...

  3. html天气插件iframe,分享常用7款天气预报代码iframe嵌入网页方式

    如果在网站上加入天气预报功能,你找不到更好的天气预报代码,可以看下本站和大家分享的7款天气预报代码iframe嵌入网页方式. 天气预报代码1 src='http://appnews.qq.com/cg ...

  4. 网页游戏mysql修改_大天使之剑奇迹网页游戏 一键服务端+架设教程+修改方法

    大天使之剑奇迹网页游戏 一键服务端+架设教程+修改方法 实施教程: 1.将user的ver和phpStudy文件夹等文件解压到磁盘上给你的目录中.示例:d 3360 \\ muser版本d: \\研究 ...

  5. iframe嵌入网页时,页面大小怎么自适应

    问题描述: 页面中有一容器div,有宽高属性.在div中嵌入一个iframe页面,呈现这种效果: 可以看到嵌入的页面只露出了一部分. 而我们希望:嵌入的页面能够完整无遮挡的展示在容器中. 整体思路:利 ...

  6. html天气插件iframe,HTML_利用iframe在网页中显示天气附效果截图,css: 复制代码代码如下: *{margi - phpStudy...

    利用iframe在网页中显示天气附效果截图 css: 复制代码代码如下: *{margin:0;padding:0;list-style-type:none;} a,img{border:0;} bo ...

  7. Unity导出的WebGL、网页前端、服务端以及硬件四级交互结构的实现(简单3d建模网页端物联网)

    本文代码基于一个智慧楼宇项目: 前提:(Unity应该使用尽量最新的版本,2020年的应该就行,2019年的未知',2018年的好像就不行了) 模式简介: 1.服务端处理楼宇发送的信息,把处理过的信息 ...

  8. C# -爬虫之WebBrowser跨域跨iframe获取网页源码

    前言:这里关键写用WebBrowser跨域跨iframe获取网页源码的部分,本意是要爬取全职高手的有声小说,这类网站特殊,网页上广告大堆,爬起来真麻烦,比如我爬取的网站的mp3源文件下载还需要秘钥的, ...

  9. 用IFRAME实现网页的内嵌和预载

    用IFRAME实现网页的内嵌和预载 在HTM(HTML)文件中是否可以像PHP.ASP文件一样嵌入其他文件呢?下面笔者介绍用iframe来实现的方法. iframe元素的功能是在一个文档里内嵌一个文档 ...

最新文章

  1. wchar用wcout输出正常cout是?
  2. MySQL 用户与授权管理详解
  3. 8月第3周回顾:四巨头发三大新闻 一报告引多家争议
  4. 羊皮卷的故事-第二章
  5. 函数 —— fork()分叉函数
  6. drcom宽带认证登录超时_开发SSO单点登录需要注意的问题
  7. u-boot.lds详细的分析
  8. how I can force redetermination everytime
  9. 51nod 1250 排列与交换——dp
  10. 源码安装mysql数据库_Linux下源码安装mysql数据库
  11. 全开源纵横支付多平台多功能支付系统源码
  12. Nancy跨平台开发总结(六)三层架构之Token认证的Rest API
  13. 第4代计算机的cpu,世界最小电脑进化第四代:继续用APU
  14. 48条高效率的PHP优化写法
  15. 【广工考试笔记】计算机系统结构考试速成笔记
  16. 快速开发微信小程序直播--微信直播--小程序直播开发
  17. 基于STM32的NRF24L01模块一对一的问题记录
  18. 分解质因数FZU - 1075
  19. 孙鑫老师的程序员之家
  20. 给你的亲人一个科技感满满的生日祝福吧

热门文章

  1. 数组push()方法以及JavaScript中的示例
  2. 仿酷狗音乐播放器开发日志二——搜索栏的编写
  3. Android应用在应用宝上线
  4. 想要简单轻松创建柱状图是怎么做到的?
  5. 佳能ip110 linux驱动下载,佳能Canon PIXMA iP110 驱动
  6. 达内终端端mysql命令_达内推荐:在PHP中使用命令行工具(一)
  7. java 链表、栈、队列、树的实现
  8. 必看,短视频创作工具大全(电脑端)
  9. indesign如何画弧线_教大家INdesign怎么绘制虚线描边连接双箭头的效果
  10. PS制作卡通透明的水晶五角星图案