标签: content-script

我正在尝试使用内容脚本制作 Chrome 扩展程序，仅匹配 Google-Images 搜索结果页面。
它们（据我所知）&tbm=isch在 URL 参数中标识。但是，匹配模式似乎只适用于路径。我该怎么做呢？

我想创建一个扩展程序，它可以读取站点的所有颜色并相应地更改所有颜色，如果您单击按钮。

我应该在哪里写这段代码？在内容脚本中还是在后台脚本中？

两者之间实际上有什么区别？

我对我的第一个“将所有内容放在一起”的 Chrome 扩展程序感到困惑，我将描述我正在尝试做的事情，然后我是如何通过一些脚本摘录来解决这个问题的：

1. 我有一个 options.html 页面和一个 options.js 脚本，它允许用户在文本字段中设置一个 url——这使用 localStorage 存储。

function load_options() {
   var repl_adurl = localStorage["repl_adurl"];
   default_img.src = repl_adurl;
   tf_default_ad.value = repl_adurl;
}

function save_options() {
   var tf_ad = document.getElementById("tf_default_ad");
   localStorage["repl_adurl"] = tf_ad.value;
}

document.addEventListener('DOMContentLoaded', function () {
   document.querySelector('button').addEventListener('click', save_options);
});

document.addEventListener('DOMContentLoaded', load_options );

Run Code Online (Sandbox Code Playgroud)

1. 我的 contentscript 将脚本“myscript”注入页面（因此它可以访问页面 html 中的 img 元素）

var s = document.createElement('script');
s.src = chrome.extension.getURL("myscript.js");
console.log( s.src );
(document.head||document.documentElement).appendChild(s);
s.parentNode.removeChild(s);

Run Code Online (Sandbox Code Playgroud)

1. myscript.js应该以某种方式获取本地存储数据并决定如何操作图像元素。

我从 html 源中抓取图像没有任何问题，但我似乎无法访问 localStorage 数据。我意识到它必须与具有不同环境的两个脚本有关，但我不确定如何克服这个问题——据我所知，我需要从 contentscript.js 注入 myscript.js，因为 contentscript.js 没有可以访问 html 源代码。 …

我有一个 Chrome 扩展程序（特别是“内容脚本”），我想在其中检测我正在监视/更改的页面是否处于全屏状态。我已经尝试了几个 API 以及“screenfull”库，但到目前为止都没有运气。有任何想法吗？

谢谢你的帮助！

根据MDN 上的这篇文章，使用 postMessage 在 chrome 中与内容脚本之间传递消息并不安全，因为无法正确定义源属性，并且其 targetOrigin 很难安全地传递到潜在的恶意站点。这仍然是真的吗？是否有其他方法可以确认收到消息的来源，并仅将消息发送到特定的内容脚本？或者除了完全使用内容脚本之外还有其他选择吗？

从内容脚本获取eventPage的首选方法是什么？旧方法(chrome.extension.getBackgroundPage)已被替换chrome.runtime.getBackgroundPage,但chrome.runtime无法从内容脚本访问API.

假设我有两个内容脚本，codeA.js并且codeB.js. 我想知道是否可以在http://www.example.comcodeA.js上运行并在http://www.domain.com上运行。codeB.js

是否可以将文件content_scripts中的my 设置manifest.json为：

"content_scripts": [
    {
        "matches": ["http://www.example.com", "http:www.domain.com"],
        "js": ["codeA.js", "codeB.js"]
    }
]

然后让每个脚本检查页面当前位于哪个 URL？如果是这样，我将如何去做这件事？

更新：
我尝试使用以下代码

if(document.location == "http://*.google.com/*" || "https://*.google.com/*") {
    alert("you are using google");
} else if(document.location == "http://*.yahoo.com/*" || "https://*.yahoo.com") {
    alert("you are using yahoo!");
}

但我不断得到you are using google。

我正在尝试使用 访问 HTML 元素content scripts，但是尽管使用run_at: document_endin ，但我在 innerText 上未定义manifest.json。

我的manifest.json：

{
  "manifest_version": 2,
  "name": "my extension",
  "browser_action": {
    "default_popup": "popup.html"
  },
  "permissions": [
    "activeTab"
  ],
  "content_scripts": [
      {
        "matches": ["http://127.0.0.1:8000/*"],
        "js": ["jquery.js", "script.js"],
        "run_at": "document_end"
      }
  ]
}

脚本.js：

var address = $('.house span').innerText;                         
alert(address);

http://127.0.0.1:8000上的网页中有一个divwith 类house和一个 span 元素。警报返回未定义，但在控制台中使用它时，它返回实际的innerText。

我在 Javascript 运行时中有一个选项卡的方法，我想从扩展的内容脚本中触发该选项卡。从表面上看，这需要在上下文之间传递消息，但我找不到 CS 到选项卡消息的任何文档，只有选项卡到 CS 或 CS 到后台。本质上，我想翻转内容脚本参考的“与嵌入页面的通信”部分。

到目前为止，我window通过注入一个小的 Javascript 有效负载将事件侦听器附加到选项卡（这将在正确类型的消息上触发选项卡方法）：

listenerScript = document.createElement('script');
listenerScript.textContent = "window.addEventListener('message',function(ev){console.log('New event: ' + ev);},false);console.log('installed');";
(document.head||document.documentElement).appendChild(listenerScript);
listenerScript.remove();

该侦听器已注册，但我无法弄清楚如何从我的内容脚本触发它。window.postMessage()内容脚本中的似乎没有做任何事情，并且文档仅讨论使用chrome.runtime创建端口，这是用于后台脚本的。

如何以最简单的方式将消息从内容脚本传递到选项卡？

我无法将复杂的Chrome扩展程序转换为Firefox附加组件.在Chrome扩展程序中,作者使用了一些Chrome API,例如

• chrome.extension.sendMessage
• chrome.browserAction.setIcon
• webkitNotifications.createNotification
• chrome.tabs.sendMessage
• chrome.extension.onMessage.addListener
• chrome.browserAction.onClicked.addListener
• chrome.privacy.services.autofillEnabled.get
• chrome.runtime.onInstalled.addListener
• chrome.tabs.query
• localStorage

等等.

我不知道如何在Firefox附加代码中实现这些方法.可以使用回调函数调用其中一些API.例如:

chrome.extension.sendMessage ( {
        type: "get.identitieswithurl",
        originUrl: lgmIdentitySave.originUrl,
        actionUrl: lgmIdentitySave.actionUrl
    }, 
    function (resultIdentities) {
        if(resultIdentities != null && resultIdentities.length > 0) {
            lgmIdentitiesPage = resultIdentities;
            fillFormsWithCredential(resultIdentities[0]);
            if(resultIdentities.length > 1 && lgmSuggestionSelectIdDismissed == false) {
                showSelectIdentitySuggestionBar();
            }
        }
    } 
);    

从这个问题,我知道Firefox代码可以像

// main add-on script
pageMod.PageMod({
    include: "*.org",
    contentScriptFile: self.data.url("my-script.js"),
    // Send the content script a message inside onAttach
    onAttach: function (worker) {
        worker.port.emit("replacePage", "Page matches …