单页面网站多少钱,社保扣款怎么在社保网站上做》,招聘网站建设流程图,长沙推广型网站建设摘要
在ios环境#xff0c;在某些情况下执行window.open不生效
一、window.open
window.open(url, target, windowFeatures)
1. url#xff1a;「可选参数」#xff0c;表示你要加载的资源URL或路径#xff0c;如果不传#xff0c;则打开一个url地址为about:blank的空…摘要
在ios环境在某些情况下执行window.open不生效
一、window.open
window.open(url, target, windowFeatures)
1. url「可选参数」表示你要加载的资源URL或路径如果不传则打开一个url地址为about:blank的空白页。
2. target「可选参数」,它可以给以下两种值
第一种是target关键字 _self当前标签页加载 _blank默认值新标签页打开 _parent作为当前浏览环境的父级浏览上下文打开没有父级浏览上下文效果与_self相同 _top作为最顶级的浏览上下文打开没有顶级浏览上下文效果与_self相同。 第二种是一个字符串 表示加载资源的浏览上下文的名称也就是标签页的名称如果这个名称在现有的标签页中不存在则会开启一个新的标签页如果存在会跳转到这个标签页。
3. windowFeatures:「可选参数」它是一个字符串用来描述窗口的特性其格式是key1value1, key2value2即将key和value以号连接拼接成字符串多个key value以逗号隔开比如我们要打开一个宽为500高为600的窗口可以这么写
window.open(url, new-window, width500,height600);二、Bug
复现问题的demo
async function jump() {await fetch(/xxx);window.open(https://www.xxx.cn);
}
正常情况下执行window.open是能正常新标签页打开传入的url的但是一旦前面用await做了异步操作后再执行window.open就不生效了。
三、原因分析
安全机制拦截IOS的Safari浏览器为了防止恶意网站通过window.open/a标签打开其他网站于是对它们的调用有所限制如果不是由用户直接交互触发的而是由程序自动触发的Safari会拦截这个操作。异步操作在AJAX回调中执行window.open/a标签跳转被浏览器认为是非用户交互行为所以被拦截。
四、解决方案
方案1改用location.href
async function jump() {await fetch(/xxx);location.href https://www.xxx.cn;
}
safari不会拦截location.href
并不是所有场景下都适合用location.href因为location.href会刷新页面所以需要根据具体场景来选择。
方案2先打开一个空标签页
async function jump() {const newWin window.open(, _blank); // 提前打开一个窗口const { jumpUrl } await fetch(/xxx);if (jumpUrl) {newWin.location jumpUrl;} else {newWin.close();// ... }
}这里根据有没有jumpUrl进行跳转如果没有jumpUrl我需要调用close方法关闭刚才提前打开的那个窗口而这样用户就会体验到的流程就是先出来一个新窗口随后被秒关闭这样用户体验很差。
方案3setTimeout/requestAnimationFrame
async function jump() {await fetch(/xxx);setTimeout(() {window.open(https://www.xxx.cn);}, 0)
}
async function jump() {await fetch(/xxx);requestAnimationFrame(() {window.open(https://www.xxx.cn);})
}
五、总结
如果setTimeout不生效可以尝试加点延时看看比如100毫秒我这边实测的ios机型都能生效所以就没加延时。
