My overall goal was to take a screenshot via the background page using:
http://developer.chrome.com/extensions/tabs.html#method-captureVisibleTab
and pass it to the content script so I can use the page's HTML DOM to analyze the screenshot and cut it up the way I would like.
However, I can't seem to pass the dataUrl back to the content script with Message Passing:
http://developer.chrome.com/extensions/messaging.html
I tried JSON.stringify() but to no avail.
This works perfectly fine:
background.js
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
sendResponse({imgSrc:'hello'});
}
);
I switch the code to this and nothing gets through:
background.js
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
chrome.tabs.captureVisibleTab(
null,
{},
function(dataUrl)
{
sendResponse({imgSrc:dataUrl});
}
)
}
);
My only proof that the background page is actually taking a screenshot is that I can do
chrome.tabs.captureVisibleTab(null,{},function(dataUrl){console.log(dataUrl);});
and I see
"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAA....etc..."
logged in background.html, which is valid
My question is: How can I send this URL to the content script?
I would prefer not to do all the logic on the background page which can't control anything on the actual visible page.
Use chrome.tabs.sendMessage
and make sure to return true
background page:
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
chrome.tabs.captureVisibleTab(
null,
{},
function(dataUrl)
{
sendResponse({imgSrc:dataUrl});
}
);
return true;
}
);
content script
chrome.runtime.sendMessage({msg: "capture"}, function(response) {
console.log(response.dataUrl);
});