如何从IMG元素获取图像内容(而不是url)？

Question

我们使用Eclipse SWT WebBrowser控件为我们的Java应用程序呈现HTML页面.如果页面包含图像,我们希望获取图像内容.我们可以访问DOM来获取IMG元素,但除了使用图像URL重新获取图像之外,似乎没有办法获取实际内容(即图像的字节).(我们可以通过'src'属性获取图像URL.)有没有办法从DOM中获取图像的实际字节？

Answer 1

我不确定这是否是您正在寻找的，但基本上您可以对图像源创建一个类型化的 XHR（例如 ArrayBuffer）（它应该被缓存，因此这样做不会产生真正的影响）。我假设您使用的是兼容 HTML5 的浏览器（或者支持 ArrayBuffer 或您需要的类型的浏览器）。我假设该文档至少有一张具有正确来源的图像，请参阅 Fiddle 进行工作演示。

var img = document.querySelector('img'), xhr = new XMLHttpRequest();
xhr.open('GET', img.src, true);
xhr.responseType = 'arraybuffer';
xhr.addEventListener('load', handleBuffer, false);
xhr.send();
// Your image data ArrayBuffer, feel free to change the type.
function handleBuffer (data) {
   var arryBuffer = data.target.response;
}

小提琴样本