时间戳

首页 > 解决方案 > 如何使用页面操作将消息从 popup.js 发送到 background.js，以便它执行内容脚本？

javascript - 如何使用页面操作将消息从 popup.js 发送到 background.js，以便它执行内容脚本？

问题描述

我做了我的第一个浏览器扩展。第一个版本运行良好，但可以改进，所以我正在重构....在这个新版本中，我使用的是 apage_action因为这个扩展只适用于一个 url 模式很重要：*://*.website.com/abc*. 弹出窗口仅在此页面上显示正常，不会在其他页面上显示 - 完全符合我的要求，但我无法popup.js向我发送消息，background.js因此它在当前浏览器的 DOM 上运行编程注入网址通过content_script.js。

出于某种原因，它还在每一页上都将图标显示为彩色（我想要灰色），我的印象是该ShowPageAction()方法可以自动将不符合条件的任何内容变灰。这是我的所有代码。

manifest.js

{
  "name": ".........",
  "description" : "...........",
  "version": "1.0",
  "manifest_version": 2,
  "icons": {
    "16": "images/a.png",
    "32": "images/b.png",
    "48": "images/c.png",
    "128": "images/d.png"
  },
  "page_action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "images/a.png",
      "32": "images/b.png",
      "48": "images/c.png",
      "128": "images/d.png"
    }
  },
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "permissions": ["tabs", "activeTab", "declarativeContent", "storage", "webNavigation", "*://*.website.com/abc*"],
}

背景.js

下面的第二个听众没有收到消息。

chrome.runtime.onInstalled.addListener(function() {
  chrome.storage.local.set({some_val: 0});
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([{
      conditions: [new chrome.declarativeContent.PageStateMatcher(
        {pageUrl: {urlContains: '.website.com/abc'},}
      )],
      actions: [new chrome.declarativeContent.ShowPageAction()]
    }]);
  });
});

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
  if (message.some_msg == 'some_msg'){
    chrome.tabs.executeScript(null, {file: 'content_script.js'});
  }
});

popup.js

对于以下内容，我已经尝试了chrome.tabs.sendMessage()和chrome.runtime.sendMessage()，但都没有工作...my_function也绑定到弹出窗口上的事件处理程序，并且工作正常，只是没有sendMessage()。

function my_function(){
    ....
    // chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    //   chrome.tabs.sendMessage(tabs[0].id, {some_msg : 'some_msg'})
    // })
    chrome.runtime.sendMessage({some_msg : 'some_msg'});
    ....
};

content_script.js

var e = document.getElementById('abcde');
// do stuff with the browser DOM ---- NOT the popup DOM.

我究竟做错了什么？

标签： javascriptgoogle-chrome-extensionbrowser-extension

解决方案

推荐阅读