如何使用HTML5或Javascript查找上传图像的分辨率？

Question

我的应用程序使用HTML5中的File API来实现拖放功能。我还需要确保丢弃的文件符合72像素/英寸的分辨率。

如何使用HTML5或Javascript找到图像的分辨率？

Answer 1

DPI是一种硬件测量，更具体地用于打印，在屏幕上查看时不适用于图像数据。像素是一个像素，它的大小取决于您正在查看的屏幕的分辨率，而不是图像文件中的设置。

如果图像为72 DPI和72像素宽，则显示为72像素宽。如果图像为144 DPI和72像素宽，它将在屏幕上显示为相同的大小。但是，在打印时，144 DPI图像的宽度将是72 DPI图像的一半。

Answer 2

这是一个（稍微过时的）JavaScript EXIF Reader。

我还建议在这里阅读this answer。

Answer 3

您可以使用blueimp Javascript-Load-Image library。您可以使用exif数据解析方法从图像中解析图像dpi和其他信息。您可以根据需要从文件标签或图像URL本地加载图像。

大多数jpeg图像和原始图像格式在exif数据中存储dpi信息。像png这样的其他格式没有exif数据的规定，因此很难提取这些图像的dpi而不实际将它们加载到像photoshop这样的图像编辑工具中。