开发chrome扩展程序的屏幕截图 [英] develop screenshot chrome extension

问题描述

我在这里看到了很多答案，但没有人是我要找的东西. 我想从chrome扩展程序中截取屏幕截图，仅用于我第一次看到的屏幕，而无需滚动页面. 并警告"创建的文件base64路径.

i saw a lot of answers here but no one is what i'm looking for. i want to take screenshot from chrome extension just for the screen i see at the first time without scrolling the page. and "alert" the created file base64 path.

我拥有所有正确的权限:

i have all the right permissions:

"permissions": [
  "activeTab",
  "tabs" ,
  "storage",
  "unlimitedStorage",
  "browsingData",
  "notifications",
  "http://*/*",
  "https://*/*",
  "file://*/*",
    "background" // added after i got the answer
],
 "background": { // added after i got the answer
    "scripts": [
        "js/background.js"
    ]
},

在我的manifest.json

in my manifest.json

我也有代码:

$(document).ready(function() {
    alert("1");
    chrome.tabs.captureVisibleTab(null, {}, function (image) {
      alert("2"); 
    });
});

我一直都得到1，但是我却从未得到2，我也不知道为什么.请帮忙.

i got 1 all the time but 2 i never get and i don't know why. please help..

谢谢..

更新

那是缺少的部分(background.js)

that's the missing part (background.js)

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

然后:

       chrome.tabs.captureVisibleTab(null, {}, function (image) {
      // alert("2");
            alert(response.imgSrc); 
    }); 

推荐答案

您不能在内容脚本中进行扩展API调用.如果您确实想在内容脚本中触发此功能，请尝试使用使用消息传递.

You can't do extension API call in content script.Try to use use message passing if you really want to trigger this function in content script.

并且请注意，自chrome rev.246766起，tabs.captureVisibleTab()的许可要求已更新.

And please note that the permission requirement of tabs.captureVisibleTab() has been updated since chrome rev.246766.

扩展名必须具有'< all_urls>'权限，或被授予 允许使用tabs.captureVisibleTab()的"activeTab"权限.

Extension need to have '< all_urls >' permission, or been granted the 'activeTab' permission to be allowed to use tabs.captureVisibleTab().

开发人员文档没有提及.

manifest.json

manifest.json

"permissions": [
    "activeTab",
    "tabs" ,
    "storage",
    "unlimitedStorage",
    "browsingData",
    "notifications",
    "http://*/*",
    "https://*/*",
    "file://*/*",
    "<all_urls>"
]

尝试在下面的后台页面中执行此代码，截图捕获将按预期工作.

Try to execute this code below in background page and screenshot capturing will work as expected.

chrome.tabs.captureVisibleTab(null,{},function(dataUri){
    console.log(dataUri);
});

屏幕截图

这篇关于开发chrome扩展程序的屏幕截图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！