Firefox扩展：如何调用window.wrappedJSObject.somePromise并传入内容脚本函数？

问题核心 #

调用页面上下文的window.wrappedJSObject.somePromiseFunc()后，直接传入内容脚本的回调函数会触发「Permission denied to access object」错误，原因是跨上下文的函数访问被浏览器安全机制限制。

可行解决方案 #

必须将内容脚本的回调函数通过exportFunction显式导出到页面上下文，确保页面的Promise可以安全调用该函数。

基础实现（回调在页面上下文处理）

// 内容脚本代码
const obj = new window.Object();

// 把内容脚本的回调函数导出到页面上下文
const pageSideCallback = exportFunction((val) => {
  // 此处为页面上下文环境，可直接处理页面返回的val
  console.log("页面Promise返回值:", val);
  // 支持返回值给页面的Promise链
  return val;
}, window.wrappedJSObject);

// 导出可被页面调用的方法
obj.validMethod = exportFunction(() => {
  // 调用页面的Promise函数，并绑定已导出到页面的回调
  return window.wrappedJSObject.somePromiseFunc().then(pageSideCallback);
}, window);

进阶实现（将结果传回内容脚本处理）

如果需要在内容脚本上下文处理Promise返回值，可通过桥接函数实现：

// 内容脚本上下文的处理逻辑
function handleInContentScript(val) {
  // 此处为内容脚本环境，可安全处理业务逻辑
  console.log("内容脚本收到页面Promise值:", val);
}

// 导出桥接函数到页面上下文，用于触发内容脚本的处理
const bridgeToContent = exportFunction((val) => {
  handleInContentScript(val);
}, window.wrappedJSObject);

const obj = new window.Object();
obj.methodWithBridge = exportFunction(() => {
  return window.wrappedJSObject.somePromiseFunc().then(bridgeToContent);
}, window);

关键注意事项 #

• 所有传入页面Promise链的回调函数，必须通过exportFunction导出到window.wrappedJSObject上下文，否则会触发权限限制。
• 避免混合不同上下文的Promise对象，尽量统一使用页面上下文的window.wrappedJSObject.Promise或内容脚本的Promise，确保回调在对应上下文执行。

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