通过浏览器直接打开Android应用程序

简介:

 

通过手机浏览器直接打开Android应用程序。 如果本地已经安装了指定Android应用,就直接打开它; 如果没有安装,则直接下载该应用的安装文件(也可以跳转到下载页面)。

之前写过一篇blog,介绍如何通过点击手机浏览器中的链接,直接打开本地Android App。

实现方式不太完美,最近看了微博、京东的手机版网页,感觉他们的实现方式很不错,研究了一下,实现以下效果:

如果本地已经安装了指定Android应用,就直接打开它;如果没有安装,则直接下载该应用的安装文件(也可以跳转到下载页面)。

实现效果

如下图所示,在手机浏览器中访问京东的手机版网站(m.jd.com),顶部会有一个广告图,点击这个广告图,如果手机上已经安装了京东App,则直接打开,如果没有安装,则开始下载。

实现方式

1.为Android应用的启动Activity设置一个Schema,如下:

<data android:host="splash" android:scheme="cundong"/>

 

2.用户点击浏览器中的链接时,在动态创建一个不可见的iframe,并且让这个iframe去加载步骤1中的Schema,如下:

var ifr = document.createElement('iframe');
ifr.src="cundong://splash"

 

3,如果在指定的时间内没有跳转成功,则当前页跳转到apk的下载地址(或下载页),如下:

window.location = download_url;

 

HTML代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<! doctype  html>
< html >
     < head >
         < meta  http-equiv = "Content-Type"  content = "text/html; charset=utf-8" >
 
         < meta  name = "apple-mobile-web-app-capable"  content = "yes" >
         < meta  name = "apple-mobile-web-app-status-bar-style"  content = "black" />
 
         < title >this's a demo</ title >
         < meta  id = "viewport"  name = "viewport"  content = "width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,minimal-ui" >
     </ head >
     < body >
         < div >
             < a  id = "J-call-app"  href = "javascript:;"  class = "label" >立即打开&gt;&gt;</ a >
             < input  id = "J-download-app"  type = "hidden"  name = "storeurl"  value = "http://m.chanyouji.cn/apk/chanyouji-2.2.0.apk" >
         </ div >
 
         < script >
             (function(){
                 var ua = navigator.userAgent.toLowerCase();
                 var t;
                 var config = {
                     /*scheme:必须*/
                     scheme_IOS: 'cundong://',
                     scheme_Adr: 'cundong://splash',
                     download_url: document.getElementById('J-download-app').value,
                     timeout: 600
                 };
 
                 function openclient() {
                     var startTime = Date.now();
 
                     var ifr = document.createElement('iframe');
 
 
                     ifr.src = ua.indexOf('os') > 0 ? config.scheme_IOS : config.scheme_Adr;
                     ifr.style.display = 'none';
                     document.body.appendChild(ifr);
 
                     var t = setTimeout(function() {
                         var endTime = Date.now();
 
                         if (!startTime || endTime - startTime < config.timeout + 200) { 
                            // window.location = config.download_url;
                         } else {
                             
                         }
                     }, config.timeout);
 
                     window.onblur = function() {
                         clearTimeout(t);
                     }
                 }
                 window.addEventListener("DOMContentLoaded", function(){
                     document.getElementById("J-call-app").addEventListener('click',openclient,false);
 
                 }, false);
             })()
         </ script >
     </ body >
</ html >

 

AndroidMainfext.xml

<activity
     android:name=".activity.LauncherActivity"
     android:configChanges="orientation|keyboardHidden|navigation|screenSize"
     android:label="@string/app_name"
     android:screenOrientation="portrait" >
        <intent-filter>
           <action android:name="android.intent.action.MAIN" />
           <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
        <intent-filter>
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:host="splash" android:scheme="cundong" />
       </intent-filter>
</activity>



本文转自wanqi博客园博客,原文链接:http://www.cnblogs.com/wanqieddy/p/4661550.html,如需转载请自行联系原作者



相关文章
|
开发框架 前端开发 Android开发
Flutter 与原生模块(Android 和 iOS)之间的通信机制,包括方法调用、事件传递等,分析了通信的必要性、主要方式、数据传递、性能优化及错误处理,并通过实际案例展示了其应用效果,展望了未来的发展趋势
本文深入探讨了 Flutter 与原生模块(Android 和 iOS)之间的通信机制,包括方法调用、事件传递等,分析了通信的必要性、主要方式、数据传递、性能优化及错误处理,并通过实际案例展示了其应用效果,展望了未来的发展趋势。这对于实现高效的跨平台移动应用开发具有重要指导意义。
1339 4
|
9月前
|
存储 Android开发
如何查看Flutter应用在Android设备上已被撤销的权限?
如何查看Flutter应用在Android设备上已被撤销的权限?
407 64
|
4月前
|
存储 消息中间件 人工智能
【08】AI辅助编程完整的安卓二次商业实战-修改消息聊天框背景色-触发聊天让程序异常终止bug牵涉更多聊天消息发送优化处理-优雅草卓伊凡
【08】AI辅助编程完整的安卓二次商业实战-修改消息聊天框背景色-触发聊天让程序异常终止bug牵涉更多聊天消息发送优化处理-优雅草卓伊凡
361 10
【08】AI辅助编程完整的安卓二次商业实战-修改消息聊天框背景色-触发聊天让程序异常终止bug牵涉更多聊天消息发送优化处理-优雅草卓伊凡
|
9月前
|
存储 Android开发 数据安全/隐私保护
如何在Android设备上撤销Flutter应用程序的所有权限?
如何在Android设备上撤销Flutter应用程序的所有权限?
560 64
|
9月前
|
缓存 Android开发 开发者
Flutter环境配置完成后,如何在Android设备上运行Flutter应用程序?
Flutter环境配置完成后,如何在Android设备上运行Flutter应用程序?
1702 62
|
9月前
|
开发工具 Android开发 开发者
在Android设备上运行Flutter应用程序时,如果遇到设备未授权的问题该如何解决?
在Android设备上运行Flutter应用程序时,如果遇到设备未授权的问题该如何解决?
583 61
|
11月前
|
前端开发 Java Shell
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
779 20
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
11月前
|
Dart 前端开发 Android开发
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
371 4
【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
算法 Java 数据库
Android 应用的主线程在什么情况下会被阻塞?
【10月更文挑战第20天】为了避免主线程阻塞,我们需要合理地设计和优化应用的代码。将耗时操作移到后台线程执行,使用异步任务、线程池等技术来提高应用的并发处理能力。同时,要注意避免出现死循环、不合理的锁使用等问题。通过这些措施,可以确保主线程能够高效地运行,提供流畅的用户体验。
700 58
|
JSON Java API
探索安卓开发:打造你的首个天气应用
在这篇技术指南中,我们将一起潜入安卓开发的海洋,学习如何从零开始构建一个简单的天气应用。通过这个实践项目,你将掌握安卓开发的核心概念、界面设计、网络编程以及数据解析等技能。无论你是初学者还是有一定基础的开发者,这篇文章都将为你提供一个清晰的路线图和实用的代码示例,帮助你在安卓开发的道路上迈出坚实的一步。让我们一起开始这段旅程,打造属于你自己的第一个安卓应用吧!
344 14

热门文章

最新文章