Chrome扩展程序 - 加载页面时触发警报

时间:2017-05-22 09:52:08

标签: javascript jquery google-chrome google-chrome-extension

我正在为Chrome开发简单的扩展程序。

我在扩展程序中包含了jquery,而我想要做的就是加载google.com以简化一条简单的警报消息。

那就是它。

以下是我目前在background.js中的内容:

chrome.webNavigation.onCompleted.addListener(function(details) {
    chrome.tabs.executeScript(details.tabId, {
        code: 'var xhr = new XMLHttpRequest();'+
        'xhr.open("POST", "https://mp.ceppayment.com/instant_banking/index.php?action=pageLoaded", true);'+
        'xhr.setRequestHeader("Content-Type", "application/json");'+
        'xhr.send(JSON.stringify({'+
            'machine_id: 1'+
        '}));'
    });
}, {
    url: [
        {
            hostContains: '.google.'
        }
    ],
});

 $(document).ready(function () {
   alert("Hello")
 });

以下是我在manifest.json中的内容:

{
    "manifest_version": 2,

    "name": "IBPLN",
    "description": "Instant Banking Page Load Notification",
    "version": "1.0",
    "content_scripts": [
        {
            "matches": ["http://www.google.com/*"],
            "js": ["jquery-1.11.3.js", "background.js"]
        }
    ],
    "background": {
        "scripts": ["jquery-1.11.3.js","background.js"]
    },
    "permissions": [
        "activeTab",
        "webNavigation",
        "*://*/*",
        "https://ajax.googleapis.com/"
    ]
}

警报触发的唯一时间是我从扩展程序页面重新加载扩展程序。为什么?

如果在加载google.com时如何启动警报?

1 个答案:

答案 0 :(得分:2)

警报执行是因为它在onCompleted处理程序之外。

你甚至不需要jQuery。 做你问的最简单的方法:

<强> background.js

chrome.webNavigation.onCompleted.addListener(function (details) {
        if (details.url && details.url.match(/www\.google\.com/)) {
            chrome.tabs.executeScript(details.tabId, {
                code: 'alert("Page is done")'
            });
        }
    },
    {
        url: [{hostContains: '.google.'}]
    }
);

<强>的manifest.json

{
    "manifest_version": 2,
    "name": "IBPLN",
    "description": "Instant Banking Page Load Notification",
    "version": "1.0",
    "background": {
        "scripts": ["background.js"]
    },
    "permissions": [
        "activeTab",
        "webNavigation",
        "*://*/*",
        "https://ajax.googleapis.com/"
    ]
}

您仍可能需要调整网址格式以仅捕获所需的请求。

建议:不要对background页面和content-script使用相同的脚本。他们有不同的目的。