exif.js读取图像Exif元数据

短命女 2022-05-13 01:30 313阅读 0赞

本文仅做翻译记录查看，GitHub地址：[https://github.com/exif-js/exif-js][https_github.com_exif-js_exif-js] 。

Exif.js用于从图像文件中读取[Exif元数据][Exif]的 JavaScript库。

您可以在浏览器中的图像上使用它，可以是图像或文件输入元素。检索Exif和Iptc元数据。该软件包也可用于AMD或CommonJS环境。

**注意**：Exif标准仅适用于.jpg和.tiff图像。此软件包中的Exif逻辑基于Exif标准v2.2（[JEITA CP-3451, included in this repo][JEITA CP-3451_ included in this repo]）。

## 安装 ##

exif-js通过NPM安装：

npm install exif-js --save

或者在在`HTML`中使用`script`添加一个引用本地文件。

**注意**：这里没有提供`.min.js`。如果你想要的话，请自己压缩。

如果您更喜欢其他包管理器，您可能会管理：D。或者您可以GIT克隆此存储库或下载它的ZIP文件并解压缩exif.js到您的项目。

## 用法 ##

该包添加了一个全局`EXIF`变量（或AMD或CommonJS等价物）。

从调用`EXIF.getData`函数开始。您将图像作为参数传递给它：

*  来自a的图像 `<img src="image.jpg">`
 *  或者用户在`<input type="file">`页面上的元素中选择的图像。

作为第二个参数，您可以指定回调函数。在回调函数中，您应该使用`this`访问上述图像的元数据，然后可以根据需要使用它。该图像现在有一个额外的`exifdata`属性，它是带有`Exif`元数据的Javascript对象。您可以访问它的属性以获取图像标题，拍摄照片的日期或方向等数据。

你可以得到所有的tages `EXIF.getAllTags()`。或者获取单个标记`EXIF.getTag()`，其中您将标记指定为第二个参数。要使用的标记名称列`EXIF.Tags`在exif.js。

**重要说明**：请注意，在调用`getData`或任何其他功能之前，您必须等待图像完全加载。否则它会默默地失败。您可以通过在`window.onLoad`函数上运行`exif-extraction`逻辑来实现此等待。或者在图像自身的`onLoad`功能上。对于jQuery用户，请注意，您不能（可靠地）使用jQuery的`ready`事件。因为它在加载图像之前触发。您可以使用`$(window).load()`而不是`$(document.ready()`（请注意\`exif-js不依赖于jQuery或任何其他外部库）。

<img src="image1.jpg" id="img1" />
    <pre>Make and model: <span id="makeAndModel"></span></div>
    <br/>
    <img src="image2.jpg" id="img2" />
    <pre id="allMetaDataSpan"></pre>
    <br/>

注意还有备用标签，例如EXIF.TiffTags。有关完整定义和使用，请参阅源代码。您还可以使用相应打印的图像中的所有EXIF信息返回一个字符串EXIF.pretty。

[https_github.com_exif-js_exif-js]: https://github.com/exif-js/exif-js
[Exif]: https://en.wikipedia.org/wiki/Exif
[JEITA CP-3451_ included in this repo]: https://github.com/exif-js/exif-js/blob/master/spec/Exif2-2.pdf