javascript - How to trigger a function on specific websites from a chrome extension? - Stack Overflow

admin管理员组

文章数量:1318156

Recently started working with Chrome Extensions. I am trying to figure out how I can execute a function on a specific website only.

For instance, I want to show an alert box on Stack Overflow only. I am using Chrome's Declarative Content API for this to match the host.

I haven't been able to find a similar question on SO for this.

My manifest.json file is running the following block of code in the background.

'use strict';

chrome.runtime.onInstalled.addListener(function() {
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([{
        conditions: [
            new chrome.declarativeContent.PageStateMatcher({
                pageUrl: {
                    hostEquals: 'stackoverflow'
                }
            })
        ],
        actions: [new chrome.declarativeContent.SOOnlyFunction()]
    }]);
});
});

function SOOnlyFunction()
{
    alert('On SO');
}

Recently started working with Chrome Extensions. I am trying to figure out how I can execute a function on a specific website only.

For instance, I want to show an alert box on Stack Overflow only. I am using Chrome's Declarative Content API for this to match the host.

I haven't been able to find a similar question on SO for this.

My manifest.json file is running the following block of code in the background.

'use strict';

chrome.runtime.onInstalled.addListener(function() {
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([{
        conditions: [
            new chrome.declarativeContent.PageStateMatcher({
                pageUrl: {
                    hostEquals: 'stackoverflow.'
                }
            })
        ],
        actions: [new chrome.declarativeContent.SOOnlyFunction()]
    }]);
});
});

function SOOnlyFunction()
{
    alert('On SO');
}

• javascript
• google-chrome
• google-chrome-extension
• google-chrome-devtools

Share Improve this question Follow asked May 8, 2016 at 12:16 Akshay KhetrapalAkshay Khetrapal 2,67655 gold badges2525 silver badges3939 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

You Can use the Chrome API to achieve this behaviour:

1. When a new Page is Loaded, you can call

   chrome.tabs.onUpdated

   here you can filter the url

2. and To Create Notifications.

   chrome.notifications.create

In your Manifest add these objects:

"permissions": [  "activeTab","tabs","notifications" ],
"background": {
    "scripts": ["background.js"],
    "persistent": false
}

Here is How my background.js looks like.

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){
  if(changeInfo.url != null){

     console.log("onUpdated." + " url is "+changeInfo.url);
     // creates Notification.
    showNotification();

  }

});

function showNotification() {

    chrome.notifications.create( {
      iconUrl: chrome.runtime.getURL('img/logo128.png'),
      title: 'Removal required',
      type: 'basic',
      message: 'URL is',
      buttons: [{ title: 'Learn More' }],
      isClickable: true,
      priority: 2,
    }, function() {});

}

It is inplete but you will get the Idea.

You can't use chrome.declarativeContent for anything but what's already built in as actions.

Which is currently specifically ShowPageAction, SetIcon and RequestContentScript (still experimental).

The reason that this can't be easily extended is because declarativeContent is implemented in native code as a more efficient alternative to JavaScript event handlers.

In general, chalk it up as an ambitious but essentially unviable/underdeveloped/abandoned idea from Chrome devs, similar fate to declarativeWebRequest.

---

See the other answer for implementation ideas using said JS handlers.

Or alternatively, you can still make it "declarative" by using content scripts declared in the manifest that will only activate on the predefined domain (as long as you know the domain in advance as a constant). They can then do something themselves or poke the event/background page to do something.

Finally, if your goal is to redirect/block the request, webRequest API is the one to look at.

本文标签： javascriptHow to trigger a function on specific websites from a chrome extensionStack Overflow