Html5 调起 Android App（Scheme，AppLinks）

最新推荐文章于 2021-06-20 08:00:42 发布

幻夜。。

最新推荐文章于 2021-06-20 08:00:42 发布

阅读量847

点赞数

分类专栏： Android

原文链接：https://www.cnblogs.com/gaidalou/p/11058484.html

版权

Android 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

Android 调起APP分为俩种方式，一种为Scheme（弊端较多），一种为AppLinks方式（有一定局限性），或者使用第三方提供的集成方式。例如：MobTech 官网链接

Scheme方式

以下Scheme方式在任何浏览器都能使用，但是是通过设置延时实现，所以会导致如果点击Link弹出打开App浮窗未点击打开App一段时间后会继续跳转到Store。

<!doctype html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no;" name="viewport"/>
    <script>
        // 检查是否安装app
        function openApp(e) {
            var u = window.navigator.userAgent;
            var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器
            var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
            if (isAndroid) {
                android();
            }
            if (isiOS) {
                ios();
            }
        }
        function android() {
            var _clickTime = new Date().getTime();
            window.location.href = 'humanage://com.humanage/openwith?name=zhangsan&age=26';
            /***打开app的协议，有安卓同事提供***/
            //启动间隔20ms运行的定时器，并检测累计消耗时间是否超过3000ms，超过则结束
            var _count = 0, intHandle;
            intHandle = setInterval(function () {
                _count++;
                var elsTime = new Date().getTime() - _clickTime;
                if (_count >= 100 || elsTime > 3000) {
                    clearInterval(intHandle);
                    //检查app是否打开
                    if (document.hidden || document.webkitHidden) {
                        // 打开了
                        window.close();
                    } else {
                        // 没打开
                        alert('Place download App')
                        window.location.href = "";//下载链接
                    }
                }
            }, 20);

        }

        function ios() {
            var _clickTime = +(new Date());
            var ifr = document.createElement("iframe");
            ifr.src = "humanage://com.humanage/openwith?name=zhangsan&age=26";
            /***打开app的协议，有ios同事提供***/
            ifr.style.display = "none";
            document.body.appendChild(ifr);
            //启动间隔20ms运行的定时器，并检测累计消耗时间是否超过3000ms，超过则结束
            var _count = 0, intHandle;
            intHandle = setInterval(function () {
                _count++;
                var elsTime = +(new Date()) - _clickTime;
                console.log(_count, elsTime, +(new Date()), _clickTime)
                if (_count >= 100 || elsTime > 3000) {
                    clearInterval(intHandle);
                    document.body.removeChild(ifr);
                    //检查app是否打开
                    if (document.hidden || document.webkitHidden) {
                        // 打开了
                        window.close();
                    } else {
                        alert('Place download App')
                        window.location.href = "https://itunes.apple.com/cn/app/id477927812";//下载链接
                    }
                }
            }, 20);
        }

        var objbtn = document.getElementById('btn');
        objbtn.onclick = function () {
            openApp()
        }

    </script>
</head>

<body>

<div class="btn_line">
    <input type="submit" class="bottom_btn" onclick="android()" value="Start agora">
</div>

</body>
</html>

Andorid:AndroidManifest.xml中添加以下代码

<activity android:name=".ui.agora.LiveCheckActivity">
            <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:scheme="humanage" android:host="com.humanage" android:pathPrefix="/openwith"/>
            </intent-filter>
</activity>

AppLinks方式

这种方式解决了Scheme的弊端，但是只适用于谷歌浏览器。

幻夜。。

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
Html5 调起 Android App（Scheme，AppLinks）

<!doctype html><html><head> <title></title> <meta charset="utf-8"> <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalab...
复制链接

扫一扫