小编Ice*_*You的帖子

在Chrome DevTools和扩展内容脚本之间进行通信

(我已经读过这篇文章并且它没有用,我做了大量的搜索和实验但没有用.)

我正在撰写Chrome扩展程序(BigConsole),目标是为Chrome开发人员工具构建更好的控制台标签.这意味着我想在页面上下文中执行用户输入的代码,可以访问页面上的DOM和其他变量.为此,通信结构如下:

  • devtools创建panel用户编写代码的位置
  • 当用户想要从执行代码panel时,panel将消息发送到一个background脚本的代码
  • 所述background脚本从接收消息/码panel并将其传递到content将其注入到所述页面脚本
  • content脚本从脚本接收消息/代码,background并将一个script元素注入页面,然后运行代码
  • script然后content使用window.postMessage 将页面上的结果发回到脚本
  • content脚本侦听页面中的消息/结果并将其传递给background脚本
  • background脚本从脚本接收消息/结果content并将其传递给panel
  • panel从接收到该消息/结果background脚本并将其插入到日志结果的

呼.

现在,当用户尝试运行代码时,没有任何反应.我把一堆console.log()s放入代码中,但控制台中没有任何内容.我的主要问题是,我在这里做了什么错误的消息传递导致什么都没发生?或者,我很想被告知我这样做过于复杂,并且有一种更好的做事方式.以下简化代码......

panel.js:

    window.onload = function() {
      var port = chrome.runtime.connect({name: "Eval in context"});
      // Add the eval'd response to the console when the background page …
Run Code Online (Sandbox Code Playgroud)

javascript-events google-chrome-extension google-chrome-devtools

5
推荐指数
1
解决办法
2731
查看次数