如何开发通用JavaScript注入器？页面加载与代码注入问题求助

核心问题 #

1. 页面加载异步性：window.open()调用后，新窗口的页面是异步加载的，你立刻访问newWin.document时，页面还没开始加载，所以拿到的是初始的about:blank文档结构。
2. 代码逻辑错误：
   • 给script标签设置属性时用了source.js，正确的属性名应该是src
   • 你把创建的script标签添加到了当前页面的document.head，而不是新窗口的newWin.document.head
3. 跨域限制：如果当前页面和https://my_example.com不同源，即使新页面加载完成，浏览器的同源策略也会阻止你操作新窗口的DOM，会抛出跨域错误。

修复后的代码（同源场景可用） #

如果目标页面和当前页面同源，可通过监听新窗口的load事件，等页面加载完成后再注入脚本：

let newWin = window.open('https://my_example.com');
// 监听新窗口加载完成事件
newWin.addEventListener('load', function() {
  try {
    var js_code = newWin.document.createElement('script');
    // 正确设置src属性
    js_code.src = 'source.js'; // source.js内容为alert('Hello World')
    // 添加到新窗口的head中
    newWin.document.head.appendChild(js_code);
    alert(newWin.document.body.parentElement.innerHTML);
  } catch (error) {
    alert(error);
  }
});

跨域场景说明 #

如果目标页面和当前页面不同源，浏览器的同源策略会完全阻止你操作新窗口的DOM，这种情况下直接通过当前页面脚本注入的方式行不通。你可以考虑：

• 让目标页面所在域名允许跨域（设置CORS头，但需要目标服务器配合）
• 改用书签工具的方式（你提到不想依赖，但这是跨域下注入脚本的常用合法方式）

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