Chrome DevTools Snippet仅打开首个本地URL，求原因与解决办法

核心原因：浏览器弹窗拦截机制 #

Chrome等现代浏览器会自动拦截非用户主动交互触发的批量弹窗。你直接通过Snippet运行脚本，属于脚本自动执行的操作，并非用户点击按钮这类主动交互，因此只有第一个弹窗可能被允许，后续的都会被浏览器的弹窗拦截器阻止——即使代码确实遍历了所有skin，后续的window.open调用也会被静默拦截。

另外你的代码存在一个小语法错误：map的箭头函数调用window.open后缺少闭合括号，修正后规范代码如下：

const skins = ["skin1", "skin2", "skin3"]
const openAllSkins = () => {
  skins.map(skin => window.open(`http://${skin}.loc.mylocalenv.com:7000`, `_blank`))
}
openAllSkins()

不过这个语法错误不会导致遍历停止，只是代码不规范，主要问题还是弹窗拦截。

可行解决方案 #

1. 改为用户主动触发（推荐）

通过添加一个页面按钮，让用户点击后执行弹窗逻辑，这类用户主动交互触发的弹窗不会被拦截：

// 在Snippet中运行这段代码，页面会出现一个可点击的按钮
const button = document.createElement('button');
button.textContent = '打开所有Skin页面';
button.style.padding = '10px 20px';
button.style.fontSize = '16px';
document.body.appendChild(button);

button.addEventListener('click', () => {
  const skins = ["skin1", "skin2", "skin3"];
  skins.forEach(skin => {
    window.open(`http://${skin}.loc.mylocalenv.com:7000`, `_blank`);
  });
});

运行后页面会出现一个按钮，点击它就能批量打开所有URL，不会被拦截。

2. 给弹窗添加延迟（临时方案）

给每个window.open添加小延迟，模拟非批量触发，有一定概率绕过拦截，但不保证100%有效：

const skins = ["skin1", "skin2", "skin3"]
const openAllSkins = () => {
  skins.forEach((skin, index) => {
    setTimeout(() => {
      window.open(`http://${skin}.loc.mylocalenv.com:7000`, `_blank`);
    }, index * 500); // 每个弹窗间隔500毫秒
  });
}
openAllSkins()

内容的提问来源于stack exchange，提问作者Thomas Ender