利用ios safari浏览器生成桌面快捷方式并唤醒app的示例代码

时间:2021-01-28 14:41:39

html 内容:

//通过a链接唤醒app

 <a href="app约定好的scheme" id="qbt" style="display:none"></a>
// 是否是全屏打开(即是否是通过桌面快捷方式打开,否就展示以下引导内容,是就触发a链接)
    <div id="msg" style="display:none">
        <div class="topDiv">
            <div class="top"></div>
        </div>
        <div class="bottomDiv">
            <div class="bottom"></div>
            <div class="arrow">
                <img src="img/arrow.png" class="arrowImg">
            </div>
        </div>
    </div>
 
script:
var hidden, visibilityChange;
if (typeof document.hidden !== "undefined") {
    hidden = "hidden";
    visibilityChange = "visibilitychange";
} else if (typeof document.mozHidden !== "undefined") {
    hidden = "mozHidden";
    visibilityChange = "mozvisibilitychange";
} else if (typeof document.msHidden !== "undefined") {
    hidden = "msHidden";
    visibilityChange = "msvisibilitychange";
} else if (typeof document.webkitHidden !== "undefined") {
    hidden = "webkitHidden";
    visibilityChange = "webkitvisibilitychange";
}
 if (window.navigator.standalone) // 全屏跳转
    {
        document.getElementById("qbt").click();
    }
    else {
        document.getElementById("msg").style.height = document.documentElement.clientHeight + 'px';
        document.getElementById("msg").style.display='block';
    }
// 添加监听器
document.addEventListener(visibilityChange, function() {
    console.log("当前页面是否被隐藏:" + document[hidden]);
    if (!document[hidden]) {
        if (window.navigator.standalone) // 全屏跳转
    {
        document.getElementById("qbt").click();
    }
    else // 端内引导页面
    {
        document.getElementById("msg").style.height = document.documentElement.clientHeight + 'px';
        document.getElementById("msg").style.display='block';
    }
    }
}, false);