如何在 Safari 扩展程序中访问和呈现已打开选项卡的可见内容？答案

【问题标题】：How to access and present the visible content of an opened tab within a safari extension?如何在 Safari 扩展程序中访问和呈现已打开选项卡的可见内容？
【发布时间】：2014-05-06 07:23:54
【问题描述】：

在开发我的 Safari 扩展程序时，我想访问在活动浏览器窗口中打开的选项卡的截屏。从SafariBrowserTab Class Reference 开始，应该可以访问visible content。如何使用它在 safari 扩展的内容页面上的图像标签中显示可见内容？

目前我能够显示所有打开的标签及其网址和标题。但是不可能得到可见的内容。

如果有人能帮我解决我的问题，那就太好了。

【问题讨论】：

标签： javascript tabs safari browser safari-extension

【解决方案1】：

在您的全局页面中，使用visibleContentsAsDataURL 和回调函数来获取截图的图像数据。然后将其发送到您的内容页面，就像您发送标题和 URL 一样。

例如：

global.js

safari.application.addEventListener('command', performCommand, false);

// Perform e.g. when toolbar button is clicked
function performCommand(event) {
    if (event.command === 'captureTab') {
        safari.application.activeBrowserWindow.activeTab.visibleContentsAsDataURL(function(imgdata){
            //console.log(imgdata);
            safari.application.activeBrowserWindow.activeTab.page.dispatchMessage('imgData', imgdata);
        });
    }
}

injected.js

safari.self.addEventListener('message', handleMessage, false);

// Receive a message from the global page
function handleMessage(msg) {
    if (msg.name === 'imgData') {
        var img = document.createElement("img");
        img.src = msg.message;
        document.body.appendChild(img);
    }
}

【讨论】：