移动端H5唤起APP的写法实例(IOS、android)
IOS
1.url scheme
这个方案基本上就是针对微信、qq内置浏览器,qq浏览器等之外的其余浏览器,从native那边要一个scheme ,然后放在a标签里或者location.href跳一下就行了
【移动端H5唤起APP的写法实例(IOS、android)】用一个iframe去做的一个跳页,有的话唤起scheme没有的话,会触发定时器跳到下载地址。但是这个方式在ios里面,在没有app的时候会遇到两次提示,
var openApp = function (src) {// 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP,并自动阻止a标签的默认行为// 否则打开a标签的href链接const ifr = document.createElement('iframe'); ifr.src = https://www.it610.com/article/src; ifr.style.display ='none'; document.body.appendChild(ifr); var poenTime = +new Date()window.setTimeout(() => {document.body.removeChild(ifr); if ((+new Date()-openTime>2500)){window.location = 'APP Store下载的地址 '}}, 600); };
2.Universal Link(ios)
这是iOS9推出的一项功能,如果你的应用支持Universal Links(通用链接),那么就能够方便的通过传统的HTTP链接来启动APP(如果iOS设备上已经安装了你的app,不需要额外做任何判断等),或者打开网页(iOS设备上没有安装你的app)。或许可以更简单点来说明,在iOS9之前,对于从各种从浏览器,Safari、UIWebView或者 WKWebView中唤醒APP的需求,我们通常只能使用scheme。
window.location.href ="https://www.it610.com/article/APP给的Universal Link"
总结
兼容写法
if (isGreaterThan9){window.location.href ="https://www.it610.com/article/APP给的Universal Link" ; return; }openApp(src)
android
方法类似
if (openApp('url scheme url')) {openApp('url scheme url'); } else {setTimeout(() => {window.location.href = 'https://www.it610.com/article/APP 市场下载地址'; // 一般是google, 各个应用商店不一样}, 600); }}
总结
到此这篇关于移动端H5唤起APP的文章就介绍到这了,更多相关移动端H5唤起APP内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
推荐阅读
- Javascript|Javascript元素滚动scoll系列 (仿淘宝固定右侧侧边栏)和移动端区别
- 前端学习之小案例|前端小案例之仿淘宝固定侧边栏
- 移动端实用性能优化
- 从零开始学WEB前端|从零开始学WEB前端——网页的行为——JavaScript基础(1)
- 【从实战带你认识gulp】打包前端项目并实现防缓存
- 后端|大名鼎鼎的 Linux —— 进程,线程,协程
- linux-驱动|NXP LS1046A及飞腾新四核 FT2004 PCIE EP端LINUX设备驱动开发
- 为什么服务器端都使用Linux系统
- SpringBoot基于redis自定义注解实现后端接口防重复提交校验
- 网络互联|互联网发展阶段的三阶段是什么(从门户到搜索,到移动互联网)