在Javascript中比较相同图像的不同大小

Question

我创建了三个不同大小的相同图像。并分别命名为image0_thumbnail.webp、image0_medium.webp和image0_original.webp。

用户将上传这些图像。我不希望用户选择相同名称的不同图像（可能来自不同的目录）。

如果他们这样做，那么将比较相同图像的这些不同大小，检查它们是否都是相同的图像，并分别显示错误。

我在JavaScript中遇到了"比较两个图像"，但它适用于相同大小的图像。我正在寻找Javascript的解决方案。请帮助

谢谢。

Answer 1

调整大小，然后选中；）例如，我使用Resemble.js来比较图像，这个库可以比较文件、图像和imageData。幸运的是，这个库有一个属性scaleToSameSize。

resemble(image1).compareTo(image2).scaleToSameSize().onComplete(function(data){
        console.log(data.misMatchPercentage)
});

1. 读取js中的文件不到1秒
2. 将文件转换为图像并加载到内存需要一些时间，需要几秒钟的时间
3. 调整大小不需要花费任何大的时间跨度（因为所有数据都已在内存中读取）
4. 比较图像不需要花费任何大的时间跨度（因为所有数据都已在内存中读取）