javascript - 如何通过点击按钮运行 Chrome 扩展？

Question

经过大量时间寻找解决方案后，我来这里寻求您的帮助。

我有一个简单的 chrome 扩展，我尝试做的事情很简单: 检测页面上的按钮何时被单击，然后打开扩展 popup.html。

一个很好的例子是MetaMask，html页面可以打开弹出窗口连接钱包，发送交易...

谢谢!

Answer 1

1. 在页面上运行内容脚本，并在单击按钮时向后台发送消息。

// Content Script

button.addEventListener("click", () => {
  chrome.runtime.sendMessage("OpenPopup")
})

在后台捕获消息并使用弹出 URL 创建一个窗口。提供“顶部”和“左侧”值，将其放置在用户屏幕的右上角。使用“popup”类型来删除通常位于窗口顶部的内容。了解有关 chrome.windows.create 方法的更多信息 here .

// Background Script

chrome.runtime.onMessage.addListener(request => {

  if (request == "OpenPopup") {

      chrome.windows.create({
          url: "popup.html",
          type: "popup",
          focused: true,
          width: 400,
          height: 600,
          top: 0,
          left: screen.width - 400,
      }, () => {
          console.log("Opened popup!")
      })

  }

})