应该不少人遇到过这种需求，扫描二维码打开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的更多相关文章

  1. h5 扫描二维码打开app和点击下载功能的实现

    window.onload = function () { jumpToapp() } var browser = { isAndroid: function () { return navigato ...

  2. 手机扫描二维码下载APP，根据操作系统不同自动下载

    Android和IOS手机扫描二维码下载APP,根据OS不同,自动处理相应下载操作.IOS自动跳转至AppStore应用下载页,Android自动下载应用的apk包. <script type= ...

  3. 生成扫描二维码下载app的二维码的方法

    进入APP store苹果应用程序商店,根据分类找到你要生成二维码的APP,然后在浏览器连接里找到ID后的一串数字就是APP的应用ID了. 安卓系统的appid 在电脑浏览器中打开应用宝官网,http ...

  4. 微信中扫描二维码自动打开手机系统默认浏览器下载APP(APK)

    很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们实现微信跳转功能即可.下面给大家介绍这个功能 功能目的 生成微信跳转链接,实现微信内置浏览 ...

  5. 制作IOS企业版App网页扫描二维码下载安装

    有时候我们需要在XX网站的主页上去扫描二维码下载,那么ios开发中如何做到这一点呢. 我给大家解答一下,这也是在最近工作中用到的部分,在网上了解了一些. 下面给大家分解一下步骤: 1.Plist 和 ...

  6. Android开发——通过扫描二维码，打开或者下载Android应用

    Android开发——通过扫描二维码,打开或者下载Android应用   在实现这个功能的时候,被不同的浏览器折磨的胃疼,最后实现了勉强能用,也查考了一下其他人的博客 android实现通过浏览器点击 ...

  7. 微信内点击链接或扫描二维码可直接用外部浏览器打开H5链接的解决方案

    很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们使用微信跳转浏览器接口实现跳转功能即可. 简单的处理方案 1. 用浏览器打开我们需要用到的 ...

  8. App阅读pdf和扫描二维码功能

    在之前开发的Android手机App中,需要实现阅读pdf和扫描二维码的功能,在github 上找到大牛封装好包,亲测可用. 阅读pdf: https://github.com/barteksc/An ...

  9. 使用vue做移动app时，调用摄像头扫描二维码

    现在前端技术发展飞快,前端都能做app了,那么项目中,也会遇到调用安卓手机基层的一些功能,比如调用摄像头,完成扫描二维码功能 下面我就为大家讲解一下,我在项目中调用这功能的过程. 首先我们需要一个中间 ...

随机推荐

  1. Navicat Premium相关注册码

    --Navicat for SQL Server V10.0.10NAVD-3CG2-6KRN-IEPMNAVL-NIGY-6MYY-XWQENAVI-C3UU-AAGI-57FW --Navicat ...

  2. 国内固定电话正则验证：'tel': [/0\d{2,3}-\d{7,8}(|([-\u8f6c]{1}\d{1,5}))$/, "请填写有效的电话号码"],

    // 验证字段 $('#info_form').validator({ rules : { checkMobile : function(ele) { return checkMobile(ele); ...

  3. Java 线程的转换及状态

    线程的状态转换是线程控制的基础. 线程状态总的可分为五大状态:分别是生.死.可运行.运行.等待/阻塞.用一个图来描述如下: 1.新建状态(New):新创建了一个线程对象. 2.就绪状态(Runnabl ...

  4. 移动端 触摸事件 ontouchstart、ontouchmove、ontouchend、ontouchcancel

    1.Touch事件简介 pc上的web页面鼠 标会产生onmousedown.onmouseup.onmouseout.onmouseover.onmousemove的事件,但是在移动终端如 ipho ...

  5. Google Code Jam Round 1A 2015 解题报告

    题目链接:https://code.google.com/codejam/contest/4224486/ Problem A. Mushroom Monster 这题题意就是,有N个时间点,每个时间 ...

  6. webapi返回json格式优化

    一.设置webapi返回json格式 在App_Start下的WebApiConfig的注册函数Register中添加下面这代码 config.Formatters.Remove(config.For ...

  7. css实现三角形箭头

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. android.widget.Toast

    widget 小部件 toast 烤面包 Toast.makeText(当前活动, 信息, 时间长短) 例:Toast.makeText(FirstActivity.this, "You c ...

  9. iOS8.3发布了Swift 1.2带来哪些新变化

    苹果前几日在面向开发者推送iOS 8.3 Beta的同时,还发布了版本号为6D520o的Xcode 6.3 Beta,其中便包含了iOS 8.3 Beta和OS X v10.10 SDK,并进一步提升 ...

  10. python 图片爬虫

    #!/usr/bin/env python #coding:utf-8 import urllib import re def GetHtml(url): """获取HT ...