使用Javascript从JPEG中提取缩略图？

Question

许多相机现在将缩略图放入JPEG和RAWs图像中。 我希望能够自动加载一些图像，然后只显示缩略图，或者更好的是仅自动加载缩略图部分以获得速度。

有没有办法在Javascript中执行此操作？

感谢。

Answer 1

你说你想在浏览器中这样做，所以当你说：

  

...或者更好的是只为缩略图部分自动加载速度。

你不会从这个客户端获得速度优势，因为必须首先下载整个图像才能制作缩略图。

您可以为检索到的图片创建缩略图，只需创建img元素并将其width和height设置为更小的内容;浏览器将做的默认操作是缩小图像（不一定非常漂亮）。

示例：

var img = document.createElement('img');
img.src = "your image url here";
img.style.width = "32px";       // Change as appropriate
img.style.height = "32px";      // Change as appropriate
document.body.appendChild(img); // Or append to some other container element

Live copy

在那里我假设它适用于强制图像是一定的宽度和高度（通常使用缩略图，如果它们的尺寸相同，它会很有用，尽管上面会弄乱纵横比）。

如果你想调整一个百分比（比如25％），你可以这样做，但它更复杂：你必须创建图像，在屏幕外加载它（有各种方法可以做到这一点），等待为了完成负载，然后进行计算。

---

如果您正在运行服务器，那么您可能最好找到可以预处理图像并为您创建缩略图的内容。例如，ImageMagick可以帮助服务器端。