记录处理ios系统web添加到主屏幕，打开不跳转到safari的方法_ios添加网页到桌面不用浏览器打开-CSDN博客

本文链接：https://blog.csdn.net/qq_45697615/article/details/147196730

问题描述

在ios系统中web添加到主屏幕后，每次打开都会跳转到safari打开一个新的页面
在这里插入图片描述

这样的打开方式不是很理想
想要每次打开能像app那样全屏显示，不显示浏览器下面地址栏
在这里插入图片描述

解决方案：

vue3项目在，puplic目录的index.html中添加以下代码即可实现

<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>

<script>
    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>