Question

我正在编写一个扩展程序，对页面上的图像右键单击做出反应。我想知道图像的尺寸，以便进一步处理。

开箱即用，我的回调获得了对标签和“信息”对象（OnClickData）的引用，该对象仅显示最少的信息。

之前有没有人遇到过这种情况？我想的是

基于srcUrl再次加载图像（如果URL是动态的，则可能无法重现）并询问它
尝试遍历选项卡的DOM以查找图像并查询它（不确定这是否需要内容脚本跨越从扩展到网页的边界）

Answer 1

Image Properties Context Menu扩展程序的作用是将用户脚本与上下文菜单API结合使用。

用户脚本将注入所有页面，侦听上下文菜单事件，并通过chrome.extension.sendRequest将有关图像的信息发送到扩展程序：

document.addEventListener("contextmenu", function (e) {
    var elem = e.srcElement;
    if (elem instanceof HTMLImageElement) {
        var img = {
            src: elem.src,
            alt: elem.alt,
            height: elem.height,
            width: elem.width
        }
        chrome.extension.sendRequest(img);
    }
}, true);

后台页面使用chrome.extension.onRequest.addListener来接收此数据，并将其存储在全局变量中。上下文菜单API单击回调从此全局变量中读取数据。

假设始终在单击回调之前处理chrome.extension.sendRequest调用，但情况可能并非总是如此。如果数据已到达，您可能需要进行回调检查，如果没有，请稍后重试（使用setTimeout）。

如何使用Chrome的Extension API右键单击用户获取的图像尺寸？

1 个答案: