如何全局重写postMessage以适配所有window实例及其获取途径

直接修改当前window.postMessage不生效的原因是：你修改的是当前窗口单个实例的属性，而iframe的contentWindow、window.open创建的新窗口都是独立的Window实例，不会继承单个实例上的自定义修改，你需要修改所有Window实例共享的原型对象。

实现代码 #

// 先缓存原生postMessage方法，避免丢失原有逻辑
const nativePostMessage = Window.prototype.postMessage;

// 重写原型上的postMessage方法
Window.prototype.postMessage = function(...args) {
  // 此处添加你需要的自定义逻辑，比如参数校验、日志上报、内容篡改等
  // 示例：打印调用信息
  console.log('postMessage调用拦截', {
    目标窗口: this,
    发送内容: args[0],
    目标源: args[1],
    传输对象: args[2]
  });

  // 调用原生方法保证原有业务逻辑正常运行
  return nativePostMessage.apply(this, args);
};

注意事项 #

• 补丁代码必须在所有iframe加载、所有新窗口创建之前执行，已经完成初始化的window实例不会继承后续的原型修改
• 你无法通过当前页面的原型重写拦截跨域iframe内部的postMessage调用，仅能拦截当前页面上下文内所有window实例上发起的postMessage调用
• Web Worker、Service Worker等环境的postMessage不属于Window原型链，需要单独对应重写Worker.prototype.postMessage等相关原型方法

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