javascript - Chrome 扩展 - chrome.tabs.executeScript 不与文件一起运行

Question

当有人按下我的 Chrome 扩展程序中的图标时，我正在尝试运行代码。当我用 code: "code..."运行代码时，它更改了标题但没有运行 jquery 代码。我读到您需要从文件执行它，所以我添加了一个文件。现在它们都不起作用，在标题更改之前(当我使用代码时)和现在(当我使用文件时)它不起作用。我添加了警报来查看运行的代码，但它们都不起作用，甚至第一个也不起作用

我有以下应用程序:

manifest.json:

{
    "name": "Pandora Likes",
    "version": "0.0.1",
    "manifest_version": 2,
    "background": { "scripts": ["background.js"] },
    "browser_action": {
        "default_icon": {
            "19": "icons/19x19.png"
        },
        "default_title": "Pandora Likes"
    },
    "permissions": ["tabs","http://*/","https://*/"]
}

背景.js:

function onClick() {
chrome.tabs.query({},function(array_of_Tabs) {
    for(var i=0;i<array_of_Tabs.length; i++){
        if(array_of_Tabs[i].url.indexOf('pandora.com')> -1) {
            //chrome.tabs.update(array_of_Tabs[i].id, { selected: true });
            chrome.tabs.executeScript(array_of_Tabs[i].id,{file: "like.js"});
        }

    }
});
}

chrome.browserAction.onClicked.addListener(onClick);

like.js:

alert("before");
document.title='gaga';
alert('after');
console.log("before);
$('.thumbDownButton').click();
console.log("after);

感谢您的帮助

Answer 1

这里有很多问题。

1. 您的match patterns ( http://*/ ) 仅匹配具有空白路径的 URL。 IE。你会匹配 http://example.com/但不是http://example.com/test/ .

   您可以使用单个匹配模式 *://*/* 来解决这个问题(匹配http或https)甚至<all_urls> 。或者，因为您只是在寻找潘多拉，*://*.pandora.com/* .

2. 您的like.js有语法错误，通过此处的语法突出显示可以明显看出。你忘记了结束语"第 4 行和第 6 行。

3. 使用 $在您的上下文脚本中，您需要 include jQuery first即使它出现在页面上，因为上下文脚本是 isolated from the page 。 (Chrome 有一个仅限控制台的 $ 版本，但内容脚本也无法使用它)

4. 即使您确实包含 jQuery，也会触发 click()可能不会导致您所期望的结果。同样，由于内容脚本是隔离的，因此单击处理程序位于页面上下文中，并且可能*不会由您的代码触发。考虑injecting code into the page .

请注意:您应该花一些精力自己调试您的扩展。 Chrome 通常会提供错误消息帮助；通过链接查看背景的页面控制台 chrome://extensions/ ，内容脚本的错误将显示在选项卡的控制台中。

<小时/>

* 可能不会被触发，因为您仍然可以创建 DOM 鼠标单击事件来触发页面的监听器，但我相当确定 .click()不会那样做。