Exif.js

一个JavaScript库，用于从图像文件中读取 EXIF元数据。

您可以在浏览器中的图像上使用它，可以从图像或文件输入元素中使用。同时检索EXIF和IPTC元数据。

这个包也可以用于AMD或CommonJS环境。

注意：EXIF标准仅适用于“.jpg”和“.tiff”图像。这个包中的EXIF逻辑是基于EXIF标准V2.2（JEITA CP-3451，包含在这个仓库中）。

汉化版：http://quping.com/themes/quping/assets/js/exif.js

安装

通过 GIT 安装 exif-js：

git clone https://github.com/exif-js/exif-js

通过 NPM ：

npm install exif-js --save

Or Bower：

bower install exif-js --save

然后在HTML中的最佳位置中添加一个引用本地文件的 script 标记。

<script src="vendors/exif-js/exif-js"></script>

您还可以使用 jsDelivr 上托管的压缩版本

<script src="https://cdn.jsdelivr.net/npm/exif-js"></script>

用法

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

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

任何一张图片来自 <img src="image.jpg">
或者用户在页面上通过 <input type="file"> 元素选择的图像。

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

您可以使用 EXIF.getTag获取所有标记。或者使用 EXIF.getTag 获取一个标记，在这里将该标记指定为第二个参数。要使用的标记名称在 exif.js 的 EXIF.Tags 中列出。

重要: 请注意，在调用 getData 或任何其他函数之前，必须等待图像完全加载。否则它不会起任何作用。可以通过在 window.onLoad 函数上运行EXIT提取方法来实现此等待。或者在图像自己的 onLoad 函数上。对于 jQuery 用户，请注意您不能（可靠地）为此使用 jQuery 的 ready 事件。因为它会在加载图像之前触发。您可以使用 $(window).load() 代替 $(document.ready()（请注意，exif-js 不依赖于 jQuery 或任何其他外部库）。

JavaScript:

window.onload=getExif;
function getExif() {
    var img1 = document.getElementById("img1");
    EXIF.getData(img1, function() {
        var make = EXIF.getTag(this, "Make");
        var model = EXIF.getTag(this, "Model");
        var makeAndModel = document.getElementById("makeAndModel");
        makeAndModel.innerHTML = `${make} ${model}`;
    });
    var img2 = document.getElementById("img2");
    EXIF.getData(img2, function() {
        var allMetaData = EXIF.getAllTags(this);
        var allMetaDataSpan = document.getElementById("allMetaDataSpan");
        allMetaDataSpan.innerHTML = JSON.stringify(allMetaData, null, "\t");
    });
}

HTML:

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

注意还有其他标记，类似 EXIF.TiffTags。有关完整的定义和用法，请参见源代码。您还可以使用 EXIF.pretty 返回一个字符串，漂亮的输出图像所有EXIF信息。检查包含的 index.html。

XMP 由于问题#53已合并，因此也支持提取XMP数据。为了不减慢速度，这是可选的，您需要在使用 ..getDatat() 之前调用 EXIF.enableXmp(); 。

请参考源代码以获得更高级的用法，例如从 File/Blob 对象获取图像数据(EXIF.readFromBinaryFile)。

贡献

这是一个开源项目。请通过分叉此仓库并发出拉取请求来进行贡献。这个项目已经有了显著的贡献，比如读取ITPC数据。

您也可以通过请提交错误或新特性问题作出贡献。或者改进文档。当您对基本功能中建议的更改执行请求时，请更新此自述文件。

Exif.js 中文说明、汉化文件

Exif.js

安装

用法

贡献