以下の記事で、IIIFの機能を簡単に試すことを目的とした「画像コレクション管理」ツールについて紹介しました。
今回は、このツールの裏側で使われている技術について紹介します。
はじめに#
画像コレクション管理ツールは、画像コレクションを国際標準規格であるIIIF(International Image Interoperability Framework)形式で管理・公開するためのWebアプリケーションです。本記事では、このツールの技術的な実装について、特にIIIF仕様の実装と地理空間情報の扱いに焦点を当てて解説します。
技術スタック#
- フロントエンド : Next.js 14 (App Router), React, TypeScript
- バックエンド : Next.js API Routes
- データストレージ : AWS S3互換オブジェクトストレージ(Cloudflare R2)
- 認証 : NextAuth.js
- 地図表示 : Leaflet, MapLibre GL JS
- IIIF ビューア : Mirador 3, OpenSeadragon
IIIF実装の詳細#
1. IIIF Presentation API v2/v3の両方をサポート#
本ツールは、IIIF Presentation APIのバージョン2とバージョン3の両方に対応しています。これにより、様々なIIIFビューアとの互換性を確保しています。
v2とv3の主な違い#
2. マルチ言語対応#
v3では、ラベルや説明文を言語別に管理できます:
3. IIIF Image APIのサポート#
外部のIIIF Image Serverから配信される画像も登録可能です。info.jsonのURLを指定することで、高解像度画像を効率的に配信できます:
地理空間情報の実装#
1. navPlace Extension(IIIF v3)#
navPlace拡張は、マニフェスト全体の代表的な位置を示すために使用されます。コレクションの地図表示などで活用されます。

2. Georeference Extension(画像の地理参照)#
Georeference拡張を使用することで、画像の特定の点を実世界の座標にマッピングできます。古地図のジオリファレンシングなどに活用されます。

実装例:対応点の設定#
3. 地図表示の実装#
コレクションマップ(Leaflet使用)#

外部ビューアとの連携#
生成されたIIIFマニフェストは、navPlace拡張とGeoreference拡張に対応した各種IIIFビューアで可視化できます。例えば、IIIF地図ビューアなどを使用することで、地理情報を含むコレクションを地図上で閲覧することが可能です。
アクセス制御の実装(予定)#
今後の実装予定として、以下のアクセス制御機能を検討しています:
1. マニフェストレベルの制御#
- マニフェスト単位での公開/非公開設定
- ユーザーグループによるアクセス権限管理
- 所有者による細かいアクセス制御
2. IIIF Auth API#
IIIF Authentication APIに準拠した認証システムの実装を予定:
- トークンベースの認証
- 時限付きアクセストークンの発行
- 外部認証プロバイダとの連携
CORSエラーの回避#
外部URLから画像を登録する際のCORS問題を、サーバーサイドプロキシで解決:
パフォーマンス最適化#
1. 画像の段階的読み込み#
2. S3互換ストレージの活用#
セルフホスティングとの連携#
Self Museumとの統合#
生成したIIIFコレクションは、Self Museumで簡単に公開できます:
0
まとめ#
画像コレクション管理ツールは、最新のIIIF仕様に準拠しながら、使いやすさとパフォーマンスを両立させた実装となっています。主な技術的特徴:
- 標準準拠: IIIF Presentation API v2/v3、Image API、navPlace/Georeference拡張をフルサポート
- 柔軟な地理情報: 単純な位置情報から複雑なジオリファレンシングまで対応
- セキュアなアクセス制御: JWTトークンベースの認証と細かいアクセス制御
- パフォーマンス: S3互換ストレージとCDN、適切な画像サイズの自動選択
- 相互運用性: 各種IIIFビューアやツールとの連携
今後は、IIIF Change Discovery APIやContent Search APIの実装、より高度な地理空間分析機能の追加などを予定しています。
参考リンク#