CPR JavaScript父框架引用在Edge、Firefox失效，原IE正常的技术问题

报错原因 #

这个错误是浏览器同源策略的严格限制导致的：新版浏览器要求两个页面的协议、域名、端口完全一致时，框架之间才能互相访问。你遇到的origin "null"通常是直接打开本地HTML文件（使用file://协议）造成的，这种场景下浏览器会判定为跨域，禁止框架间的访问；而旧版IE对本地文件的同源策略限制宽松，所以能正常运行。

修复方法 #

• 用本地HTTP服务器运行代码
  不要直接双击打开HTML文件，通过本地服务器（比如Node.js的http-server、Python的内置服务器）访问页面，让所有页面的协议、域名、端口保持一致，满足同源要求。
  示例：用Python 3启动服务器

  python -m http.server 8000
  

  之后在浏览器访问http://localhost:8000/index.html即可正常访问parent.frames。

• 用postMessage实现跨域通信（跨域场景必备）
  如果必须在跨域环境下传递数据，不能直接访问父框架的frames对象，需通过postMessageAPI实现安全的跨域通信：
  父页面代码：

  window.addEventListener('message', function(event) {
    // 验证消息来源，提升安全性
    if (event.origin !== '子页面的实际源地址') return;
    // 收集框架名称列表
    const frameNames = Array.from(window.frames).map(frame => frame.name);
    // 将结果发送给子页面
    event.source.postMessage(frameNames, event.origin);
  });
  

  子页面（index.html）修改后的代码：

  var MTMFrameNames = [];
  // 向父页面发送获取框架名称的请求
  window.parent.postMessage('requestFrameNames', '*');
  // 监听父页面的回复
  window.addEventListener('message', function(event) {
    if (Array.isArray(event.data)) {
      MTMFrameNames = event.data;
      // 此处编写后续使用MTMFrameNames的逻辑
    }
  });
  

• 临时关闭浏览器同源限制（仅开发测试用）
  仅用于本地调试，严禁在生产环境使用：

  • Firefox：地址栏输入about:config，搜索security.fileuri.strict_origin_policy并设为false
  • Edge/Chrome：启动时添加参数--disable-web-security --user-data-dir="本地临时目录路径"

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