来源：Vue3 + vite + Ts + pinia + 实战 + 源码 +electron

EXIF

EXIF（Exchangeable Image File，可交换图像文件）当中包含了专门为数码相机的照片而定制的元数据，可以记录数码照片的拍摄参数、缩略图及其他属性信息，即镶嵌在JPEG/TIFF图像文件格式内的一组拍摄参数

EXIF信息不支持png、webp等图片格式的

人们拍照片时，照片会存储一些隐私信息，例如拍摄的位置，拍摄的时间，相机参数等，这些信息也可能泄露，例如在社交媒体发送照片

微信图片使用默认传输时，它的体积会被压缩得很小，因为破坏了EXIF信息，而设置了原图传输后，微信将保留图片的EXIF信息，可以被别人查看

读取EXIF

点开图片的属性可以查阅EXIF，也可以使用专门查看EXIF的工具

JavaScript也可以读取EXIF信息，需要EXIF.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!-- CDN引入 -->
<script src="https://cdn.jsdelivr.net/npm/exif-js"></script>
<div>
  <img width="300" height="300" id="img1" src="./noOrigin.jpg" alt="">
  <p>非原图</p>
</div>
<div>
  <img width="300" height="300" id="img2" src="./origin.jpg" alt="">
  <p>原图</p>
</div>
<div>
  <img width="300" height="300" id="img3" src=".114514.jpg" alt="">
  <p>原图2</p>
</div>
1
2
3
4
5
const file = document.querySelector('#img3')
EXIF.getData(file, function () {
    const data = EXIF.pretty(this);
    console.log(data);
})

方法：

  • EXIF.getData(img, callback)：获取图像的数据
  • EXIF.getTag(img, tag)：获取图像的某个数据
  • EXIF.getAllTags(img)：获取图像的全部数据，值以对象的方式返回
  • EXIF.pretty(img)：获取图像的全部数据，值以字符串的方式返回

部分参数：

  • GPS 相关名称
    • GPSVersionIDGPS：版本
    • GPSLatitudeRef：南北纬
    • GPSLatitude：纬度
    • GPSLongitudeRef：东西经
    • GPSLongitude：经度
    • GPSAltitudeRef：海拔参照值
    • GPSAltitude：海拔
    • GPSTimeStamp：GPS时间戳
    • GPSSatellites：测量的卫星
    • GPSStatus：接收器状态
    • GPSMeasureMode：测量模式
    • GPSDOP：测量精度
    • GPSSpeedRef：速度单位
    • GPSSpeed：GPS接收器速度
    • GPSTrackRef：移动方位参照
    • GPSTrack：移动方位
    • GPSImgDirectionRef：图像方位参照
    • GPSImgDirection：图像方位
    • GPSMapDatum：地理测量资料
    • GPSDestLatitudeRef：目标纬度参照
    • GPSDestLatitude：目标纬度
    • GPSDestLongitudeRef：目标经度参照
    • GPSDestLongitude：目标经度
    • GPSDestBearingRef：目标方位参照
    • GPSDestBearing：目标方位
    • GPSDestDistanceRef：目标距离参照
    • GPSDestDistance：目标距离
  • GPS 处理方法名
    • GPSAreaInformation：GPS区功能变数名
    • GPSDateStampGPS：日期
    • GPSDifferential：GPS修正