将capturevisibletab映像保存到临时文件中，以通过node.js服务器发送

我正在尝试使用Chrome扩展名捕获可见的选项卡。我设法将图像显示在另一个选项卡中以检查其工作。但是我实际上希望拍摄图像，将用户计算机上的临时文件中的png除外。然后最终将其发送到服务器，但这是另一个问题。如果格式很差，我正在学习。

var id = 100;
chrome.browserAction.onClicked.addListener(function() {
  chrome.tabs.captureVisibleTab(function(screenshotUrl) {
    var viewTabUrl = chrome.extension.getURL('../HTML/InfoPullHTML.html?id=' + id++)
    var targetId = null;
    chrome.tabs.onUpdated.addListener(function listener(tabId, changedProps) {
      if (tabId != targetId || changedProps.status != "complete")
        return;
      // alert('test2');
      chrome.tabs.onUpdated.removeListener(listener);
      // alert('test3');
      var views = chrome.extension.getViews(); 
      // alert('test4');
      for (var i = 0; i < views.length; i++) {
        var view = views[i];
        // alert('test' + (i + 5));
        if (view.location.href == viewTabUrl) {
          view.setScreenshotUrl(screenshotUrl);
          break;
        }
      }
    });
    // alert('AfterForLoop');
    chrome.tabs.create({url: viewTabUrl}, function(tab) {
      targetId = tab.id;
    });
  });
});

拍摄图像。将图像另存为png并保存在用户计算机上的临时文件中。

现在，我唯一的结果实际上是拍摄图像，然后显示在新标签中。我是编码的初学者，我没有关于如何向前推进的丝毫线索。

<!DOCTYPE html>
<html>
<script src="../JavaScript/BrowserInfoJS.js"></script>
<script src="../JavaScript/ScreenshotTargetJS.js"></script>
<head>
    <title></title>
</head>
<body>
    Image here:
  <p>
    <img id="target" src="../images/white.png">
  <p>
    End image
</body>
</html>

这是一旦单击扩展名，将在图像上显示的页面。

您可以使用存储API。要保存文件，请使用文件系统。

，但由于您似乎要保存文件仅在以后上传，因此处理本地存储API会更简单：

chrome.tabs.captureVisibleTab({format:"png"}, src=>{
    //
    chrome.storage.local.get({"captured": []}, s=>{
            //
            s.captured.push(src);
            chrome.storage.local.set({"captured": s.captured});
        });
});

如果要存储大图像，请确保声明unlimitedStorage许可，或一次以上图像。

相关内容

最新更新

热门标签：