Universal-Viewer

Universal Viewer 4.xの「Unknown content type」エラーとローカルホスティングによる対処

発生した問題 Nuxt 3プロジェクトでIIIFマニフェストの画像を表示するために、Universal Viewer（UV）をiframeで埋め込んでいました。従来は外部の https://universalviewer.io/uv.html を参照していましたが、ある時点からビューアが表示されなくなりました。ブラウザのコンソールには以下のエラーが出力されます。 SES Removing unpermitted intrinsics UV.js:2 Unknown content type 原因の調査 universalviewer.ioのリダイレクトまず確認したところ、universalviewer.io は universalviewer.dev にリダイレクトされるようになっていました。 <meta http-equiv="refresh" content="0; url=https://universalviewer.dev/uv.html"> リダイレクト先の universalviewer.dev/uv.html でも同じ「Unknown content type」エラーが発生します。公式サイト自体で問題が再現する状態でした。埋め込み用HTMLの初期化方式の違い UV 4.xには2つのHTMLファイルが同梱されています。 uv.html：iframe埋め込み用。IIIFURLAdapter(true)（embeddedモード）で初期化 index.html：デモページ。IIIFURLAdapter()（通常モード）で初期化し、iiifManifestIdを明示的に渡す uv.htmlの埋め込みモードでは、IIIF Presentation API 2.0のマニフェストを読み込んだ際にコンテンツタイプの判定に失敗し、「Unknown content type」が発生するようです。一方、デモページ（index.html）と同じ初期化方式を使うと正常に動作します。Netlifyにデプロイされた uv-v4.netlify.app で確認できました。 https://uv-v4.netlify.app/#?manifest=https://kokusho.nijl.ac.jp/biblio/200017711/manifest&cv=80 URLパラメータの形式もうひとつの違いは、URLパラメータの渡し方です。 uv.html（埋め込み用）：?manifest=...#?cv=...（クエリパラメータ＋ハッシュ） index.html（デモ用）：#?manifest=...&cv=...（ハッシュパラメータのみ）動作する方式はハッシュパラメータのみで完結する形式でした。対処方法 1. UV 4.2.1をローカルに配置 npmパッケージからUV 4.2.1の必要ファイルを public/uv/ に配置しました。 npm pack universalviewer@4.2.1 tar xzf universalviewer-4.2.1.tgz 最終的に必要なファイルは以下の4点です。 public/uv/ ├── umd/ # UV本体 + チャンクJS（約190ファイル） ├── uv.css # スタイルシート ├── uv.html # 埋め込みページ（カスタム版） └── uv-iiif-config.json # IIIF設定 cjs/、esm/、デモ用のindex.htmlやコレクションJSONは不要です。 ...

2026年3月23日 · 2 分 · Nakamura

Universal Viewer：IIIFに対応したマルチメディアビューアの決定版

はじめにデジタルアーカイブの世界では、画像だけでなく、音声、動画、3D モデルなど多様なメディアを統一的に閲覧できる仕組みが求められています。IIIF（International Image Interoperability Framework）は、こうしたデジタルコンテンツの相互運用性を実現するための国際的な標準仕様です。本記事では、IIIF に完全準拠したオープンソースのマルチメディアビューア Universal Viewer（UV）を紹介します。 Universal Viewer とは Universal Viewer は、IIIF マニフェストを読み込んで、画像・音声・動画・3D モデルなどのデジタルコンテンツを表示するための Web ベースのビューアです。MIT ライセンスで公開されており、世界中の図書館・博物館・大学で採用されています。英国図書館（British Library）をはじめ、多くの主要文化機関がコレクションの公開に Universal Viewer を利用しています。主な機能マルチメディア対応 Universal Viewer の最大の特徴は、単一のビューアで複数のメディアタイプに対応していることです。画像 — OpenSeadragon を利用した高解像度画像のズーム・パン音声 — 音声ファイルの再生とタイムライン表示動画 — 動画コンテンツの再生 3D モデル — Three.js による 3D オブジェクトの表示と操作 PDF — ドキュメントの表示 IIIF 完全準拠 IIIF Presentation API および Image API に完全対応しています。IIIF マニフェスト URL を指定するだけで、メタデータや構造情報を含むリッチなビューイング体験を提供します。サムネイルパネルコレクション内の全ページ・アイテムをサムネイルで一覧表示し、目的のページに素早くアクセスできます。大量のページを持つ書籍や写真コレクションの閲覧に便利です。ダウンロード機能閲覧中のコンテンツを各種サイズ・フォーマットでダウンロードできます。研究者が必要な画像を取得する際に役立ちます。多言語対応インターフェースは多言語に対応しており、日本語を含む多数の言語で利用できます。 ...

2026年3月15日 · 1 分 · Nakamura

Universal Viewer：画像・音声・動画・3Dに対応したIIIFビューア

Universal Viewerとは Universal Viewer（UV）は、IIIF（International Image Interoperability Framework）に準拠したオープンソースのビューアである。最大の特徴は、その名の通り「ユニバーサル」であること。画像だけでなく、音声、動画、3Dモデル、PDFなど、多様なメディア形式をひとつのビューアで閲覧できる。MITライセンスで公開されており、TypeScriptで実装されている。 IIIFビューアといえばMiradorが有名だが、Universal Viewerは画像以外のメディアへの対応力で際立っている。デモページでは、実際にさまざまな形式のコンテンツを試すことができる。多様なメディア形式への対応 Universal Viewerが対応するメディア形式は幅広い。画像：高解像度の画像をスムーズにズーム・パンできる。IIIF Image APIに対応しているため、タイル画像の効率的な配信が可能だ。Deep Zoomにも対応しており、巨大な画像でもストレスなく閲覧できる。音声・動画：IIIF Presentation API 3で定義された音声や動画コンテンツを再生できる。タイムラインベースのナビゲーションにより、長いコンテンツでも目的の箇所にすばやくアクセスできる。 3Dモデル：博物館の収蔵品や建築モデルなど、3Dコンテンツの表示にも対応している。ブラウザ上で回転・拡大しながら立体的に閲覧できるのは大きな魅力だ。 PDF：PDF文書もビューア内で直接閲覧可能。デジタル化された文書資料をそのまま提供する場合に便利である。採用している主な機関 Universal Viewerは、世界中の図書館・博物館・アーカイブで採用されている。大英図書館（British Library）：膨大なデジタルコレクションの閲覧にUVを使用している。ウェルカム図書館（Wellcome Library）：医学史関連の資料をUVで公開している。UVの開発にも深く関わってきた機関のひとつだ。ウェールズ国立図書館（National Library of Wales）：ウェールズの歴史的資料をUVで提供している。 Internet Archive：大規模なデジタルアーカイブの閲覧にUVを活用している。このように、大規模な機関がプロダクション環境で採用している実績は、UVの安定性と信頼性を示している。主な機能ツリーナビゲーション複数ページからなる写本や書籍を閲覧する際に、ツリー構造でページを一覧表示し、目的のページにジャンプできる。IIIF Manifestに含まれるStructures（Range）情報を利用して、章立てや論理的な構造に沿ったナビゲーションを提供する。これは特にデジタル化された古典籍や写本の閲覧で威力を発揮する。サムネイルパネル全ページのサムネイルを一覧表示するパネルを備えている。目的のページを視覚的に探すことができ、大量のページを含むコンテンツの閲覧を効率化する。マニフェスト内検索 IIIF Content Search APIに対応しており、テキストが付与されたマニフェスト内での全文検索が可能だ。OCRされた文書であれば、キーワードで目的の箇所を素早く見つけられる。フルスクリーンモードブラウザ全体を使ったフルスクリーン表示に対応しており、没入感のある閲覧体験を提供する。埋め込み IFRAMEタグを使って外部のWebページにUVを埋め込むことができる。デジタルコレクションを自機関のWebサイトに組み込みたい場合に便利である。設定はJSONベースで柔軟にカスタマイズできる。 IIIF Presentation API 2と3への対応 Universal ViewerはIIIF Presentation API 2と3の両方に対応している。API 3では音声・動画のサポートが強化されており、UVはこの仕様にいち早く対応したビューアのひとつだ。既存のAPI 2のマニフェストも引き続き問題なく表示でき、移行期にある機関にとって心強い選択肢となる。他のIIIFビューアとの比較 IIIFビューアにはいくつかの選択肢がある。簡単に比較してみよう。ビューア画像音声/動画 3D 注釈編集比較表示 Universal Viewer ○ ○ ○ △ △ Mirador ○ △ × ○ ○ OpenSeadragon ○ × × × × Miradorは注釈の編集や複数マニフェストの比較表示に強みがある。研究用途で画像を詳細に分析したい場合はMiradorが適している。 ...

2026年3月14日 · 1 分 · Nakamura