如何向受权限保护的Universal Viewer添加IIIF Manifest？

针对你提到的两种需求，这里提供可行的实现方案：

一、直接传入已获取的Manifest数据 #

目前Universal Viewer的init方法原生不支持直接传入Manifest JSON数据的参数，但可以通过拦截Manifest请求的方式来实现。当UV尝试请求指定的Manifest URL时，直接返回你已提前获取的本地数据，无需发起真实网络请求：

import { init } from 'universalviewer';

// 提前获取合法的Manifest数据
const myManifestData = await getManifest(myManifestUrl);

// 拦截全局fetch请求，返回本地Manifest数据
const originalFetch = window.fetch;
window.fetch = async (url, options) => {
  if (url === myManifestUrl) {
    return new Response(JSON.stringify(myManifestData), {
      headers: { 'Content-Type': 'application/json' }
    });
  }
  // 其他请求保持原逻辑
  return originalFetch(url, options);
};

// 正常初始化UV，传入原Manifest URL
init('uv-viewer', {
  iiifManifestId: myManifestUrl
});

二、为请求添加授权头 #

Universal Viewer没有内置类似Mirador的请求预处理器配置，但可以通过全局拦截fetch请求，为IIIF相关请求自动添加授权头：

import { init } from 'universalviewer';

// 拦截全局fetch，为目标请求添加授权头
const originalFetch = window.fetch;
window.fetch = async (url, options) => {
  // 根据实际场景匹配IIIF请求（比如Manifest、Canvas资源等）
  const isIiifRequest = url === myManifestUrl || url.includes('/iiif/');
  
  if (isIiifRequest) {
    return originalFetch(url, {
      ...options,
      headers: {
        ...options?.headers,
        authorization: `Bearer ${getToken()}`
      }
    });
  }
  
  return originalFetch(url, options);
};

// 初始化UV
init('uv-viewer', {
  iiifManifestId: myManifestUrl
});

另外你提到的项目Issue #43确实涉及授权相关的功能优化，后续版本可能会提供更原生的配置方式，若有需要可以关注其进展。

内容的提问来源于stack exchange，提问作者TessavWalstijn