CODEWITHSUNDEEP
javascriptjquerygoogle-chromegoogle-chrome-extension
Jonovono
Jonovono

Reputation: 2085

Chrome captureVisibleTab in content script

I am trying to use the captureVisibleTab chrome extension API in a content script so that in can capture every page while running in the background.

From what I can tell this has to be done using message passing. Can someone give me a quick example on how this could be achieved?

I was trying something like:

 {
 "name": "TabCapture",
 "version": "0.0.1",
"manifest_version": 2,
"description": "Capture a tab",
"background" : {
"scripts" : ["background.js"],
"persistent": true
 },
 "browser_action": {
  "default_icon": "icon.png",
"default_title": "Capture tab"      
 },
 "content_scripts": [
{
  "matches": ["http://*/*"],
  "js": ["jquery.js", "send.js"]
}
],
  "permissions" : ["tabs", "<all_urls>"]
}

Send.js

chrome.runtime.sendMessage({msg: "capture"}, function(response) {
 console.log(response.dataUrl);
});

background.js

chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
    console.log('holla');
    chrome.tabs.captureVisibleTab(
        null,
        {},
        function(dataUrl)
        {
            sendResponse({imgSrc:dataUrl});
        }
    ); //remember that captureVisibleTab() is a statement
    return true;
}

);

But it does not seem to work. Am I missing something?

Upvotes: 0

Views: 1916

Answers (1)

krg265
krg265

Reputation: 393

Ok, you just did a minor mistake. You are sending Object {imgSrc: dataUrl} where imgSrc is the property of the object but when you are accessing the object in content script you are accessing attribute response.dataUrl. Change it to response.imgSrc, reload extension then reload your pages and every thing will work fine. And there is a syntax error in background.js change the statement to :

chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
    console.log('holla');
    chrome.tabs.captureVisibleTab(
        null,
        {},
        function(dataUrl)
        {
            sendResponse({imgSrc:dataUrl});
        }
    ); //remember that captureVisibleTab() is a statement
    return true;
});

and add "https://*/*" in match url(in permissions) of content script also to capture all webpages.

Upvotes: 4

Related Questions