Exifビューワーコンポーネント
外部ライブラリに依存せずにJPEGのExif情報を解析・表示するコンポーネント
デモ
以下のビューワーに画像をアップロードするか、URL を指定することでExif情報を確認できます。 アップロードはブラウザに直接読み込まれサーバーにデータが渡されることはありません。 Exif情報がちゃんと削除されたかを見るのにも良いと思います。
Select or upload an image to see Exif details
特徴
- 外部ライブラリ不要:
DataViewを用いてバイナリレベルでJPEG/TIFF構造をパースしています。 - GPS連携: Exifに含まれる位置情報を解析し、OpenStreetMapで場所を表示します。
- 詳細情報: 露出設定、デバイス情報、GPS、拡張情報など、主要なタグを網羅しています。
技術的なポイント
バイナリ解析において、以下の点に配慮しました。
- エンディアン対応: TIFFヘッダによるLittle EndianとBig Endianの自動判別。
- オフセット処理: 4バイトを超えるデータ(文字列や配列など)のオフセット先参照。
- IFDチェーン: メインIFDだけでなく、サブIFD(Exif, GPS)の再帰的なパース。
- メモリ管理: ブラウザの
URL.createObjectURLで生成した参照を適切にrevokeしてメモリリークを防いでいます。 - Exif Proxy: URLを指定する際、CORS の問題で fetch できないものはプロキシサーバーでデータ取得しています。