Chrome扩展程序 - 在popup.html中为当前标签激活脚本

Question

我不确定如何正确地提出这个问题因为它很难解释所以我会用一个例子。

我想要做的是弄清楚如何激活像bookmarklet这样的东西，使用chrome扩展的popup.html内部的链接，该链接将与当前选项卡进行交互。

例如：如果单击chrome扩展图标，则会出现一个弹出窗口（通常的下拉窗口）。在那个窗口中会有一个增加图像大小的按钮（就像书签栏的书签一样）。

我想要的是该按钮与当前打开的选项卡而不是popup.html页面进行交互。

我在清单中有适当的权限（所有网址和标签）以及正在定义的脚本。一切都在那里测试好了。但我知道我的解决方案（不工作）可能不合适，我甚至可能在这一点上也不会接近。所以我在这里寻求帮助。

background.js

function zii() {

    function zoomImage(image, amt) {
        if (image.initialHeight == null) { /* avoid accumulating integer-rounding error */
            image.initialHeight = image.height;
            image.initialWidth = image.width;
            image.scalingFactor = 1;
        }
        image.scalingFactor *= amt;
        image.width = image.scalingFactor * image.initialWidth;
        image.height = image.scalingFactor * image.initialHeight;
    }
    var i, L = document.images.length;
    for (i = 0; i < L; ++i) zoomImage(document.images[i], 2);
    if (!L) alert("This page contains no images."); 

}

popup.html

<button onClick="zii()">Test</button>

后台功能也链接在popup.html页面内。实际的popup.html页面非常大，所以我只是在这里展示了它的基础知识，而没有包含与扩展的其他方面相关的所有相关代码。

我显然不知道我做错了什么，或者我正在尝试什么是可能的。

目标摘要：简单地说，我只想点击popup.html中的按钮，并在当前打开的选项卡上增加图像的大小（与使用书签的方式相同）。

Answer 1

首先，我建议阅读有关extensions architecture的内容。

如果你想通过单击弹出窗口中的按钮在当前窗口中注入.js文件或某些代码，你可以通过在你的按钮onclick处理程序中使用chrome.tabs.executeScript，同时将null作为第一个tabId参数传递，因为它默认为活动当前窗口的选项卡。

例如：

chrome.tabs.executeScript(null, {
    code: "console.log('Injected.')"
});

要么：

chrome.tabs.executeScript(null, {
    file: "content.js"
});

一定要在你的"activeTab"权限中拥有manifest.json。