第一步：head头部需要添加

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="apple-mobile-web-app-capable" content="yes">
 //设置打开app后顶部横条的颜色
<meta name="apple-mobile-web-app-status-bar-style" content="black">
//桌面app图标设置
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="/static/images/icon-57.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/static/images/icon-72.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/static/images/icon-114.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/static/images/icon-144.png">

第二部：添加js禁止页面跳转到Safari浏览器（尽可能的在head中添加）

<script type="text/javascript">
//iOS Web APP中点击链接跳转到Safari 浏览器新标签页的问题 devework.com
//stanislav.it/how-to-prevent-ios-standalone-mode-web-apps-from-opening-links-in-safari
if(("standalone" in window.navigator) && window.navigator.standalone){
    var noddy, remotes = false;
    document.addEventListener('click', function(event) {
        noddy = event.target;
        while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {
            noddy = noddy.parentNode;
        }
        if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes))
        {
            event.preventDefault();
            document.location.href = noddy.href;
        }
    },false);
}
</script>

判断当前设备

var u = navigator.userAgent;
if (u.indexOf('Android') > -1{
    console.log("当前设备是安卓");
}
if ( u.indexOf('Linux') > -1 {
    console.log("当前设备是Linux");
}
if(window.navigator.standalone){
    console.log("这是一个从ios桌面打开的web-app");
}
if ( u.indexOf('iphone') > -1 {
    console.log("当前设备是iphone");
}