使用扫描二维码打开app

时间：2023-01-21 08:33:28

应该不少人遇到过这种需求，扫描二维码打开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&lpar;APK&rpar;

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

  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. vs安装失败&comma;发生严重错误&comma;错误号&colon;Error 0x80070643

    发生这个的原因很大的可能是vs安装的目录不是系统默认目录,改一下就好了. C:\Program File(x86) 不要看网上那些没有的,都TM骗人的. 不要问我是怎么知道的,你只要知道我的电脑让我重 ...

  2. 《C程序设计的抽象思维》2&period;10编程练习（未完）

    本文地址:http://www.cnblogs.com/archimedes/p/programming-abstractions-in-c-2.html,转载请注明源地址. 2.按照规定求圆柱的表面 ...

  3. Volley（四）—— ImageLoader &amp&semi; NetworkImageView

    Volley(四)—— ImageLoader & NetworkImageView ImageLoader是一个加载网络图片的封装类,其内部还是由ImageRequest来实现的.但因为源码 ...

  4. Windows下使用命令行设置ip地址的DNS服务器

    使用命令行或者编写bat批处理设置网络连接的IP地址以及DNS服务器地址有时候会比手动更加方便,IP地址和DNS的设置一般是配合的,常用到的几个状态是: 1.IP地址动态获取,DNS也动态 2.IP地 ...

  5. cocos2dx 搭建 android 平台 -2

    1.配置Cocos2d-x for Xcode. 这一块比较简单, 可以参见其他文章. 重点:install-templates-xcode.sh 2.配置普通Android开发环境 这一块包括JDK ...

  6. spring注解一次 清除多个缓存

    @Caching(evict = { @CacheEvict(value="cacheName",key="#info.id+'_baojia'",before ...

  7. iSlide——图标库、图示库的用法

    iSlide中,有一个“图示库”功能,主要功能是同时排列多块文字或多张图片.单击插图库,会弹出一个新的对话框.从中,可以选择权限.分类.数量数据和样式,也可以直接搜索.   下面就举一个例子:我要开一 ...

  8. 利用jvisualvm使用btrace进行线上调试案例

    用途:btrace主要用于线上调试.通过btrace,可在不改动代码的前提下,方便的发现以下问题: 1.定位性能慢的接口服务: 2.实时打印堆栈信息,定位死锁位置: 3.定位占用大量内存空间的代码块: ...

  9. loj&num;2054&period; 「TJOI &sol; HEOI2016」树

    题目链接 loj#2054. 「TJOI / HEOI2016」树 题解 每次标记覆盖整棵字数,子树维护对于标记深度取max dfs序+线段树维护一下 代码 #include<cstdio&gt ...

  10. 【原创】Silverlight的ComboBox&period;SelectValue无法赋值

      前几天开发中 给ComboBox的SelectValue属性赋值是,老是赋不上去.之前SelectValue为Null,执行完调试看下,还是Null.很诡异   ComboBox的SelectVa ...

相关文章