使用扫描二维码打开app
应该不少人遇到过这种需求,扫描二维码打开app如果用户没有这个app则提示它跳转。
用网页直接来调用app是不打可能的,必须原生那边先做一些配置。
首先,安卓和苹果的调用方法是不同的。
所以我们需要先判断一下终端。
var u = navigator.userAgent,
app = navigator.appVersion;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
之后最好是分别跳转到两个不同的页面去做操作,因为苹果需要在头部配置一个app-id<meta name='apple-itunes-app' content='app-id=1115968341'>
下面是苹果的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name='apple-itunes-app' content='app-id=1115968341'>
<title></title> </head>
<body>
<a href="https://itunes.apple.com/cn/app/yi-fang-kuai-le-xue-tang/id1115968341?mt=8" id="openApp">点击打开</a> <script type="text/javascript">
//苹果
document.getElementById('openApp').onclick = function(e){
// 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP,并自动阻止a标签的默认行为
// 否则打开a标签的href链接
var ifr = document.createElement('iframe');
ifr.src = 'iosefunbox://';
ifr.style.display = 'none';
document.body.appendChild(ifr);
window.setTimeout(function(){
document.body.removeChild(ifr);
},3000)
}; </script>
</body>
</html>
这里的ifr.src就是你去打开app的协议路径,安卓和苹果是不一样的。 如果是安卓机的话就简单了
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
</head>
<body> <a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.edufound.mobile" id="openApp">点击打开</a>
<script type="text/javascript"> //安卓
// /**/window.location.href = "http://a.app.qq.com/o/simple.jsp?pkgname=com.edufound.mobile"; // 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP,并自动阻止a标签的默认行为
// 否则打开a标签的href链接
var ifr = document.createElement('iframe');
ifr.src = 'efunbox://efunbox.app/efunbox/open';
ifr.style.display = 'none';
document.body.appendChild(ifr);
window.setTimeout(function(){
document.body.removeChild(ifr);
},3000); </script>
</body>
</html>
这是我们原先的需求,后来变了,说苹果直接跳转到appstore里面就好了,不用直接打开,安卓的话需要直接打开。
这样我就直接把它们集合在一个网页就行。
我上面的a链接是直接跳转到腾讯应用宝里面。
用网页扫描访问的话是没问题的,
但是我就感觉会出事,后来拿微信扫一扫就蒙逼了。安卓只会打开a链接,跳转不进app,因为被微信拦截掉了,苹果也一样,解决的方案只能是点击右上角,提示用户在浏览器打开就没问题。这种方法是无奈之举,但后来针对苹果机找到了一个解决它的方案就是,a链接的跳转直接跳腾讯应用宝上架的链接,然后微信内部会处理帮你自动跳转到appstore里面。
最后是整合了一下的代码。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body id="body">
<script type="text/javascript">
var u = navigator.userAgent,
app = navigator.appVersion;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
if(isIOS){
window.location.href = "http://a.app.qq.com/o/simple.jsp?pkgname=com.edufound.mobile";
}
if(isAndroid){
alert("请点击右上角在浏览器打开");
window.location.href = "http://a.app.qq.com/o/simple.jsp?pkgname=com.edufound.mobile";
var ifr = document.createElement('iframe');
ifr.src = 'efunbox://efunbox.app/efunbox/open';
ifr.style.display = 'none';
document.body.appendChild(ifr);
window.setTimeout(function(){
document.body.removeChild(ifr);
},3000);
}
</script>
</body>
</html>
使用扫描二维码打开app的更多相关文章
- h5 扫描二维码打开app和点击下载功能的实现
window.onload = function () { jumpToapp() } var browser = { isAndroid: function () { return navigato ...
- 手机扫描二维码下载APP,根据操作系统不同自动下载
Android和IOS手机扫描二维码下载APP,根据OS不同,自动处理相应下载操作.IOS自动跳转至AppStore应用下载页,Android自动下载应用的apk包. <script type= ...
- 生成扫描二维码下载app的二维码的方法
进入APP store苹果应用程序商店,根据分类找到你要生成二维码的APP,然后在浏览器连接里找到ID后的一串数字就是APP的应用ID了. 安卓系统的appid 在电脑浏览器中打开应用宝官网,http ...
- 微信中扫描二维码自动打开手机系统默认浏览器下载APP(APK)
很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们实现微信跳转功能即可.下面给大家介绍这个功能 功能目的 生成微信跳转链接,实现微信内置浏览 ...
- 制作IOS企业版App网页扫描二维码下载安装
有时候我们需要在XX网站的主页上去扫描二维码下载,那么ios开发中如何做到这一点呢. 我给大家解答一下,这也是在最近工作中用到的部分,在网上了解了一些. 下面给大家分解一下步骤: 1.Plist 和 ...
- Android开发——通过扫描二维码,打开或者下载Android应用
Android开发——通过扫描二维码,打开或者下载Android应用 在实现这个功能的时候,被不同的浏览器折磨的胃疼,最后实现了勉强能用,也查考了一下其他人的博客 android实现通过浏览器点击 ...
- 微信内点击链接或扫描二维码可直接用外部浏览器打开H5链接的解决方案
很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们使用微信跳转浏览器接口实现跳转功能即可. 简单的处理方案 1. 用浏览器打开我们需要用到的 ...
- App阅读pdf和扫描二维码功能
在之前开发的Android手机App中,需要实现阅读pdf和扫描二维码的功能,在github 上找到大牛封装好包,亲测可用. 阅读pdf: https://github.com/barteksc/An ...
- 使用vue做移动app时,调用摄像头扫描二维码
现在前端技术发展飞快,前端都能做app了,那么项目中,也会遇到调用安卓手机基层的一些功能,比如调用摄像头,完成扫描二维码功能 下面我就为大家讲解一下,我在项目中调用这功能的过程. 首先我们需要一个中间 ...
随机推荐
- C#操作Mongodb的心得
Mongodb是一个强大的文档型数据库,采用BSON的数据格式.本文主要采用其官方的C#驱动来操作其表中的集合.驱动版本为1.1.0,下载地址为: http://mongodb.github.io/m ...
- python pymysql和orm
pymsql是Python中操作MySQL的模块,其使用方法和MySQLdb几乎相同. 1. 安装 管理员打开cmd,切换到python的安装路径,进入到Scripts目录下(如:C:\Users\A ...
- PHP的启动与终止
1.2 PHP的启动与终止 PHP程序的启动可以看作有两个概念上的启动,终止也有两个概念上的终止. 其中一个是PHP作为Apache(拿它举例,板砖勿扔)的一个模块的启动与终止, 这次启动php会初始 ...
- webapi返回json格式优化
一.设置webapi返回json格式 在App_Start下的WebApiConfig的注册函数Register中添加下面这代码 config.Formatters.Remove(config.For ...
- python for MSSQLserver
# -*- coding: utf-8 -*- '''python coded by written in 2016/8/31 Used for get win os log for each win ...
- Openbox中指定目录打开程序
现在遇到这样的情况,在浏览器的下载中,点击在文件夹中显示, 结果这个使用系统调用的是Baobab,一款分析磁盘使用情况的软件,而不是使用目录浏览程序,例如nautilus 查询后知道,系统使用xdg- ...
- Java线程间通信方式剖析——Java进阶(四)
原创文章,同步发自作者个人博客,转载请在文章开头处以超链接注明出处 http://www.jasongj.com/java/thread_communication/ CountDownLatch C ...
- 笔记--mysql rpm 安装
1.rpm包下载 http://taokey.blog.51cto.com/4633273/1630561
- 一次APP测试的感悟
项目经理担责任.产品担责任.测试只需要把测试中发现的问题展示出来.如实反应问题.谁担责任谁有权利决定上不上线.所以他们直接绕过了测试.APP的上线让我学到了很多东西,见识了很多东西,也感悟了很多.这是 ...
- busybox的编译、使用及安装
转载于:http://blog.sina.com.cn/wyw1976 busybox是什么? (1)busybox是Linux上的一个应用程序(application),即只有一个ELF文件头. ( ...