安卓:从网页唤醒APP

前言

现在都流行立体式的互联网,一般公司都会有自己的APP,网站,微信公众号,小程序等众多流量入口。为了更好的用户体验,也为了提高用户粘度,打通这些程序的入口,使其联动成为一体十分重要,以此达到相互引流的作用。
APP和网页之间的联动最为常见。很多网页都有这样的功能:在网页点击某一个按钮,或者跳转到某一网页之后,就会唤醒APP,以此达到联动效果。

分析

我们都知道各个系统用的开发语言不尽相同,那么这种效果到底是如何做的呢?
答案就是……scheme。
对应到安卓中就是具体表现为 xml 中的 android:scheme 属性,通过<intent-filter> 设置data,已达到类似Intent的隐式匹配的效果。
当然跳转之前还需要做次判断,如果手机中没有安装APP,则跳转到对应的下载网页。

从网页打开APP,如果没有安装就进行下载。当然,也可以做别的操作处理,比如跳转应用市场一类的详情页面。在此仅提供思路,欢迎发散思维。

网页唤醒APP,除了安卓外,ios也可以达到同样效果。不过scheme等略有不同,这就需要在网页中去判断当前设备是否是安卓设备。常见的判断方法就是通过网络请求中的UA去判断。

UA,全称是 User Agent,中文名为用户代理,它是一个特殊字符串头,使得服务器能够识别客户使用的操作系统及版本、CPU 类型、浏览器及版本、浏览器渲染引擎、浏览器语言、浏览器插件等。

言归正传 ,我们来看一下如何实现

实现

安卓AndroidMainfext.xml

首先需要指定要启动哪一个Activity,然后为该activity设置添加intent-filter。
在要启动的activity下面添加一个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="vchao" />
       </intent-filter>

html 网页

在网页中,我们这里只做了简单的处理,点击的时候进行判断跳转。

<!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>唤醒APP</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(){
                /*获取UA标识,并转为小写*/
                var ua = navigator.userAgent.toLowerCase();
                var t;
                var config = {
                    /*scheme:必须*/
                    scheme_IOS: 'vchao://',
                    scheme_Adr: 'vchao://splash',
                    download_url: document.getElementById('J-download-app').value,
                    timeout: 600
                };

                function openclient() {
                    var startTime = Date.now();

                    var ifr = document.createElement('iframe');
                    
                    /*通过UA标识,判断是否是苹果系统*/
                    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>

如果需要传参数。

在html网页中直接拼接参数。

vchao://splash/?arg0=marc&arg1=xie

在唤醒的activity页面做参数的接收。

    Uri uri = getIntent().getData();  
     if (uri != null) {  
         String test1 = uri.getQueryParameter("arg0");  
         String test2 = uri.getQueryParameter("arg1");  
         tv.setText(test1 + test2);  
     }  
发布了70 篇原创文章 · 获赞 176 · 访问量 31万+

猜你喜欢

转载自blog.csdn.net/zheng_weichao/article/details/79612310
今日推荐