在浏览器中打开手机app

最新推荐文章于 2024-05-08 17:42:54 发布

_逆生长

最新推荐文章于 2024-05-08 17:42:54 发布

阅读量6.8k

点赞数

分类专栏： JavaScript 文章标签： javaScript

本文链接：https://blog.csdn.net/lovemark8/article/details/52382850

版权

JavaScript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

在浏览器中打开手机APP 如果手机中没有安装则跳转到下载页面
其实不管用户有没有安装App 最终都会跳转到App下载页，因为判断不了用户是否安装App，只能是每次尝试去打开不管成功或者失败都会到下载界面

<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="call_app" href="javascript:;" class="label">立即打开&gt;&gt;</a>
</div>

<script>

        var u = navigator.userAgent;
        //android终端
        var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;
        //ios终端
        var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);


        var config = {
            /**scheme:必须*/
            scheme_IOS:'yuancios://',
            /** yuancandroid  这个必须全部小写*/
            scheme_Adr: 'yuancandroid://splash',
            download_url_ios: 'ios下载地址',
            download_url_adr: 'android下载地址',
            timeout: 600
        };

        var openApp = function () {
            //ios9不支持iframe 所以直接用href跳转,不过这种方式并不完美
            //ios 手机如果没有安装要打开的app 会弹窗提示链接无效 不太友好
            //不过苹果官方好像出了一个通用链接的方式处理 有需要的可以去百度一下这种实现方式

            //所以用两个定时器 而如果跳应用失败 会打开下载链接
            //reload 并不会打断 App Store 的跳转。
            if (isiOS) {
                location.href = config.scheme_IOS;
                setTimeout(function () {
                    location.href = config.download_url_ios;
                }, config.timeout + 900);
                setTimeout(function () {
                    location.reload();
                }, config.timeout + 1400);

            } else if (isAndroid) {

                //如果安卓有浏览器不支持iframe 可以判断浏览器类型然后用
                // window.location.href 直接跳转 这种方式处理
                var ifr = document.createElement('iframe');
                ifr.src =  config.scheme_Adr;
                ifr.style.display = 'none';
                document.body.appendChild(ifr);

                setTimeout(function () {
                    location.href = config.download_url_adr;
                }, config.timeout + 400);

            }
        };
        document.getElementById("call_app").addEventListener('click', openApp, false);


</script>

</body>
</html>

_逆生长

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
在浏览器中打开手机app

在浏览器中打开手机APP 如果手机中没有安卓则跳转到下载页面其实不管用户有没有安装App 最终都会跳转到App下载页，因为判断不了用户是否安装App，只能是每次尝试去打开不管成功或者失败都会到下载界面<html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta na
复制链接

扫一扫