Accelerate Reader content loading

app.py

@@ -14,7 +14,7 @@ from urllib.parse import unquote, quote, urljoin, urlparse
 import aiohttp
 import jieba
 from fastapi import FastAPI, Query, Request
-from fastapi.responses import FileResponse, HTMLResponse, JSONResponse, PlainTextResponse, StreamingResponse
+from fastapi.responses import FileResponse, HTMLResponse, JSONResponse, PlainTextResponse, Response, StreamingResponse
 from fastapi.staticfiles import StaticFiles
 from fastapi.middleware.cors import CORSMiddleware
 from fastapi.middleware.gzip import GZipMiddleware
@@ -390,15 +390,58 @@ def validate_voiceofml_source_url(url: str) -> str:
         raise ValueError("只允许 VoiceOfML 数据集文件")
     return url
 
-async def open_download_response(session, url: str, timeout: aiohttp.ClientTimeout):
+
+READER_ASSET_SOURCE_RE = re.compile(
+    r"^/datasets/vomebook/Reader-Assets/resolve/main/objects/[0-9a-f]{2}/[0-9a-f]{64}/(?:[a-z0-9-]+/)?(?:document\.pdf|book\.epub)$"
+)
+VOICEOFML_READER_SOURCE_RE = re.compile(r"^/datasets/VoiceOfML/[A-Za-z0-9._-]+/(?:resolve|raw)/main/.+$")
+
+
+def validate_reader_source_url(url: str) -> str:
+    url = normalize_download_url(url)
+    validate_download_url(url)
+    parsed = urlparse(url)
+    if parsed.hostname != "huggingface.co" or parsed.fragment or parsed.query:
+        raise ValueError("不允许的阅读来源")
+    decoded_path = unquote(parsed.path)
+    if "\\" in decoded_path or "\x00" in decoded_path or any(part in (".", "..") for part in decoded_path.split("/")):
+        raise ValueError("不允许的阅读来源路径")
+    if VOICEOFML_READER_SOURCE_RE.fullmatch(decoded_path) or READER_ASSET_SOURCE_RE.fullmatch(decoded_path):
+        return url
+    raise ValueError("不允许的阅读来源")
+
+
+async def open_download_response(
+    session,
+    url: str,
+    timeout: aiohttp.ClientTimeout,
+    *,
+    method: str = "GET",
+    request_headers: Optional[dict[str, str]] = None,
+):
+    method = method.upper()
+    if method not in ("GET", "HEAD"):
+        raise ValueError("不支持的上游请求方法")
     current_url = validate_download_url(url)
+    headers = {"Accept-Encoding": "identity"}
+    headers.update(request_headers or {})
     for _ in range(MAX_REDIRECTS + 1):
-        response = await session.get(
+        request_method = getattr(session, "request", None)
+        if request_method is not None:
+            response = await request_method(
+                method,
+                current_url,
+                allow_redirects=False,
+                timeout=timeout,
+                headers=headers,
+            )
+        else:
+            response = await session.get(
             current_url,
             allow_redirects=False,
             timeout=timeout,
-            headers={"Accept-Encoding": "identity"},
-        )
+                headers=headers,
+            )
         if response.status not in (301, 302, 303, 307, 308):
             return response
         location = response.headers.get("Location")
@@ -1224,6 +1267,7 @@ app.add_middleware(
     allow_origins=["*"],
     allow_methods=["*"],
     allow_headers=["*"],
+    expose_headers=["Accept-Ranges", "Content-Range", "Content-Length", "ETag", "Last-Modified"],
 )
 
 @app.middleware("http")
@@ -1399,6 +1443,65 @@ def api_bootstrap():
 def api_ping():
     return PlainTextResponse(status_code=204, headers={"Cache-Control": "no-store"})
 
+
+READER_UPSTREAM_RESPONSE_HEADERS = (
+    "Content-Type", "Content-Length", "Content-Range", "Accept-Ranges",
+    "ETag", "Last-Modified", "Cache-Control",
+)
+
+
+@app.api_route("/api/reader-content", methods=["GET", "HEAD"])
+async def api_reader_content(request: Request, url: str = Query(...)):
+    try:
+        target_url = validate_reader_source_url(url)
+    except ValueError as exc:
+        return JSONResponse({"error": str(exc)}, status_code=403)
+    forwarded_headers = {
+        name: request.headers[name]
+        for name in ("Range", "If-Range")
+        if name in request.headers
+    }
+    semaphore = app.state.upstream_semaphore
+    await semaphore.acquire()
+    try:
+        upstream = await open_download_response(
+            app.state.http_session,
+            target_url,
+            aiohttp.ClientTimeout(total=180, connect=15, sock_read=60),
+            method=request.method,
+            request_headers=forwarded_headers,
+        )
+    except Exception as exc:
+        semaphore.release()
+        print(f"阅读代理异常: {exc}")
+        return JSONResponse({"error": str(exc) or "上游阅读文件加载失败"}, status_code=502)
+    headers = {name: upstream.headers[name] for name in READER_UPSTREAM_RESPONSE_HEADERS if name in upstream.headers}
+    headers.setdefault("Cache-Control", "public, max-age=300")
+    headers["Content-Encoding"] = "identity"
+    status = upstream.status
+    if request.method == "HEAD":
+        upstream.release()
+        semaphore.release()
+        return Response(status_code=status, headers=headers)
+    if status not in (200, 206, 304, 416):
+        upstream.release()
+        semaphore.release()
+        return JSONResponse({"error": f"上游阅读文件加载失败: HTTP {status}"}, status_code=status)
+
+    async def stream_reader_content():
+        try:
+            async with upstream:
+                async for chunk in upstream.content.iter_chunked(65536):
+                    yield chunk
+        except Exception as exc:
+            print(f"阅读代理异常: {exc}")
+            raise
+        finally:
+            semaphore.release()
+
+    return StreamingResponse(stream_reader_content(), status_code=status, headers=headers)
+
+
 @app.get("/api/download")
 
 async def api_download(file: str = Query(...), link: str = Query(...)):
@@ -1519,7 +1622,7 @@ async def serve_txt_proxy(txt_path: str):
 
     return StreamingResponse(stream_txt(), media_type="text/plain; charset=utf-8")
 
-HASHED_ASSET_RE = re.compile(r"\.[0-9a-f]{12}\.(?:js|css)$")
+HASHED_ASSET_RE = re.compile(r"\.[0-9a-f]{12}\.(?:js|css|mjs)$")
 
 
 class HashedStaticFiles(StaticFiles):

scripts/copy_reader_vendor.mjs

@@ -50,6 +50,9 @@ for (const [url, target, expected] of [
   const actual = createHash("sha256").update(bytes).digest("hex");
   if (actual !== expected) throw new Error(`${url}: SHA-256 ${actual} does not match ${expected}`);
   writeFileSync(join(output, target), bytes);
+  const dot = target.lastIndexOf(".");
+  const versioned = `${target.slice(0, dot)}.${actual.slice(0, 12)}${target.slice(dot)}`;
+  writeFileSync(join(output, versioned), bytes);
 }
 }
 

static/app.js

@@ -744,6 +744,31 @@ function navigateToReader(rawUrl, returnUrl = location.href) {
   return true;
 }
 
+const warmedReaderAssets = new Set();
+function warmReaderIntent(rawUrl) {
+  if (!rawUrl) return;
+  let extension = "";
+  try { extension = (new URL(rawUrl, location.origin).searchParams.get("ext") || "").toLowerCase(); } catch (_) { return; }
+  const assets = extension === "pdf"
+    ? ["/static/vendor/pdf.min.e0be3863c23c.mjs", "/static/pdf-worker-wrapper.mjs", "/static/vendor/pdf.worker.min.0613f41490dd.mjs"]
+    : extension === "epub" ? ["/static/vendor/epub.min.06eae1574510.js"]
+    : ["md", "markdown"].includes(extension) ? ["/static/vendor/marked.min.eaccee2fb9fb.js", "/static/vendor/purify.min.c2f26ea4fc0d.js"] : [];
+  for (const href of assets) {
+    if (warmedReaderAssets.has(href)) continue;
+    warmedReaderAssets.add(href);
+    const link = document.createElement("link"); link.rel = "prefetch"; link.href = href; document.head.appendChild(link);
+  }
+  try { fetch("/api/ping", { cache: "no-store" }).catch(() => {}); } catch (_) {}
+}
+
+function setupReaderIntentWarming() {
+  const warm = (event) => {
+    const target = event.target.closest("[data-reader-url], [data-read-url]");
+    if (target) warmReaderIntent(target.dataset.readerUrl || target.dataset.readUrl);
+  };
+  for (const type of ["pointerover", "pointerdown", "focusin"]) document.addEventListener(type, warm, { passive: true });
+}
+
 function isReadableRecord(rec) {
   return VoiceOfMLReader.capability(rec && (rec.ReaderExtension || rec.Extension)).article;
 }
@@ -2946,6 +2971,7 @@ function setupResultDelegation() {
 
 async function init() {
   cacheDOM();
+  setupReaderIntentWarming();
   STATE.isDark = localStorage.getItem("theme") !== "light";
   applyTheme();
   const savedMobile = localStorage.getItem("mobileMode");

static/pdf-worker-wrapper.mjs

@@ -23,7 +23,7 @@ const pendingMessages = [];
 const bufferMessage = event => pendingMessages.push(event);
 self.addEventListener("message", bufferMessage);
 
-import("./vendor/pdf.worker.min.mjs").then(() => {
+import("./vendor/pdf.worker.min.0613f41490dd.mjs").then(() => {
   self.removeEventListener("message", bufferMessage);
   for (const event of pendingMessages) self.dispatchEvent(new MessageEvent("message", { data: event.data }));
 });

static/reader.html

@@ -6,9 +6,10 @@
 <meta name="theme-color" content="#181a1d">
 <meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'self'; style-src 'self'; img-src 'self' data: blob: https://huggingface.co https://hf-mirror.com https://*.huggingface.co https://*.hf.co https://*.xethub.hf.co; connect-src 'self' blob: https://huggingface.co https://hf-mirror.com https://*.huggingface.co https://*.hf.co https://*.xethub.hf.co; worker-src 'self' blob:; frame-src 'self' blob:; font-src 'self' data:; base-uri 'none'; form-action 'none'; object-src 'none'">
 <title>VoiceOfML Reader</title>
+<link rel="preconnect" href="https://huggingface.co" crossorigin>
 <link rel="stylesheet" href="/static/reader.css">
-<script src="/static/reader-contract.js"></script>
-<script src="/static/reader-store.js"></script>
+<script defer src="/static/reader-contract.js"></script>
+<script defer src="/static/reader-store.js"></script>
 </head>
 <body>
 <header class="reader-toolbar">

static/reader.js

@@ -1,8 +1,8 @@
-const PDFJS_URL = "/static/vendor/pdf.min.mjs";
+const PDFJS_URL = "/static/vendor/pdf.min.e0be3863c23c.mjs";
 const PDFJS_WORKER_URL = "/static/pdf-worker-wrapper.mjs";
-const EPUB_URL = "/static/vendor/epub.min.js";
-const MARKED_URL = "/static/vendor/marked.min.js";
-const PURIFY_URL = "/static/vendor/purify.min.js";
+const EPUB_URL = "/static/vendor/epub.min.06eae1574510.js";
+const MARKED_URL = "/static/vendor/marked.min.eaccee2fb9fb.js";
+const PURIFY_URL = "/static/vendor/purify.min.c2f26ea4fc0d.js";
 if (!Map.prototype.getOrInsertComputed) {
   Map.prototype.getOrInsertComputed = function(key, callback) {
     if (this.has(key)) return this.get(key);
@@ -25,6 +25,7 @@ if (!Math.sumPrecise) {
 }
 const params = new URLSearchParams(location.search);
 const sourceUrl = params.get("url") || "";
+const contentUrl = `/api/reader-content?url=${encodeURIComponent(sourceUrl)}`;
 const downloadUrl = params.get("download") || sourceUrl;
 const extension = (params.get("ext") || "").toLowerCase();
 const capability = VoiceOfMLReader.capability(extension);
@@ -52,6 +53,8 @@ let saveTimer = 0;
 let pdfDocument = null;
 let pdfRenderGeneration = 0;
 let pdfActiveRenders = 0;
+let pdfShellsReady = Promise.resolve();
+let restorationApplied = false;
 const pdfRenderWaiters = [];
 let epubRendition = null;
 let epubLocation = "";
@@ -98,11 +101,12 @@ document.querySelector("#page-next").addEventListener("click", () => epubRenditi
 async function goToPage(value) {
   if (!pageCount) return;
   const page = VoiceOfMLReader.clampNumber(value, 1, pageCount, 1);
+  await pdfShellsReady;
   const shell = content.querySelector(`.reader-page[data-page="${page}"]`);
   if (shell) {
     await renderPdfShell(shell, false, true);
     shell.scrollIntoView({ block: "start" });
-    if (restoredEntry && page === restoredEntry.page && restoredEntry.pageOffset) viewport.scrollTop += restoredEntry.pageOffset;
+    if (!restorationApplied && restoredEntry && page === restoredEntry.page && restoredEntry.pageOffset) { viewport.scrollTop += restoredEntry.pageOffset; restorationApplied = true; }
   }
   currentPage = page; pageInput.value = String(page); scheduleSave();
 }
@@ -178,13 +182,24 @@ async function renderPdf(prepared) {
     const visible = entries.filter((entry) => entry.isIntersecting).sort((a, b) => b.intersectionRatio - a.intersectionRatio)[0];
     if (visible) { currentPage = Number(visible.target.dataset.page); pageInput.value = String(currentPage); scheduleSave(); }
   }, { root: document.querySelector("#viewport"), threshold: [0.2, 0.5, 0.8] });
-  for (let page = 1; page <= pdf.numPages; page++) {
+  const createShell = (page) => {
     const shell = document.createElement("section"); shell.className = "reader-page"; shell.dataset.page = String(page);
     shell.style.aspectRatio = `${firstViewport.width} / ${firstViewport.height}`;
     const canvas = document.createElement("canvas"); canvas.setAttribute("aria-label", `第 ${page} 页`); shell.appendChild(canvas);
-    content.appendChild(shell); observer.observe(shell); pageObserver.observe(shell);
-  }
-  if (restoredEntry && restoredEntry.page) requestAnimationFrame(() => goToPage(restoredEntry.page));
+    observer.observe(shell); pageObserver.observe(shell); return shell;
+  };
+  const firstShell = createShell(1); content.appendChild(firstShell);
+  await renderPdfShell(firstShell, false, true);
+  pdfShellsReady = (async () => {
+    for (let start = 2; start <= pdf.numPages; start += 24) {
+      const fragment = document.createDocumentFragment();
+      for (let page = start; page < Math.min(start + 24, pdf.numPages + 1); page++) fragment.appendChild(createShell(page));
+      content.appendChild(fragment);
+      await new Promise((resolve) => setTimeout(resolve, 0));
+    }
+  })();
+  await pdfShellsReady;
+  if (restoredEntry && restoredEntry.page) await goToPage(restoredEntry.page);
 }
 
 async function renderPdfShell(shell, force = false, priority = false) {
@@ -263,7 +278,9 @@ function rerenderVisiblePdfPages() {
   }
 }
 async function renderText(markdown, prepared) {
-  const response = await prepared.response; if (!response.ok) throw new Error(`HTTP ${response.status}`);
+  let response = await prepared.response;
+  if (!response.ok) response = await fetch(sourceUrl);
+  if (!response.ok) throw new Error(`HTTP ${response.status}`);
   const text = await response.text();
   if (!markdown) { const pre = document.createElement("pre"); pre.className = "reader-text"; pre.textContent = text; content.appendChild(pre); }
   else {
@@ -276,9 +293,14 @@ async function renderText(markdown, prepared) {
 async function renderEpub(prepared) {
   await prepared;
   const frame = document.createElement("div"); frame.className = "epub-frame"; content.appendChild(frame);
-  const book = ePub(sourceUrl); epubRendition = book.renderTo(frame, { width: "100%", height: "100%", spread: "none", flow: "scrolled-doc" });
+  try { await displayEpub(contentUrl, frame); }
+  catch (_) { frame.textContent = ""; await displayEpub(sourceUrl, frame); }
+  status.textContent = "EPUB";
+}
+async function displayEpub(url, frame) {
+  const book = ePub(url); epubRendition = book.renderTo(frame, { width: "100%", height: "100%", spread: "none", flow: "scrolled-doc" });
   epubRendition.on("relocated", (location) => { epubLocation = location && location.start ? location.start.cfi : ""; scheduleSave(); });
-  await epubRendition.display(restoredEntry && restoredEntry.epubLocation || undefined); status.textContent = "EPUB";
+  await epubRendition.display(restoredEntry && restoredEntry.epubLocation || undefined);
 }
 async function start() {
   if (!validSource(sourceUrl) || capability.readerMode === VoiceOfMLReader.ReaderMode.UNSUPPORTED) return fail("此文件暂不支持在线阅读，请下载原文件。");
@@ -302,11 +324,11 @@ async function start() {
   } catch (error) { console.error(error); fail("原文件加载失败，请检查网络后重试，或下载原文件。"); }
 }
 function prepareDocument() {
-  if (capability.mode === "pdf") return import(PDFJS_URL).then((pdfjs) => { pdfjs.GlobalWorkerOptions.workerSrc = PDFJS_WORKER_URL; return pdfjs.getDocument({ url: sourceUrl, withCredentials: false }).promise; });
-  if (capability.mode === "markdown") return Promise.all([fetch(sourceUrl), Promise.all([loadScript(MARKED_URL), loadScript(PURIFY_URL)])]).then(([response, engines]) => ({ response, engines }));
-  if (capability.mode === "text") return fetch(sourceUrl).then((response) => ({ response }));
+  if (capability.mode === "pdf") return import(PDFJS_URL).then((pdfjs) => { pdfjs.GlobalWorkerOptions.workerSrc = PDFJS_WORKER_URL; return pdfjs.getDocument({ url: contentUrl, withCredentials: false }).promise.catch(() => pdfjs.getDocument({ url: sourceUrl, withCredentials: false }).promise); });
+  if (capability.mode === "markdown") return Promise.all([fetch(contentUrl), Promise.all([loadScript(MARKED_URL), loadScript(PURIFY_URL)])]).then(([response, engines]) => ({ response, engines }));
+  if (capability.mode === "text") return fetch(contentUrl).then((response) => ({ response }));
   if (capability.mode === "epub") return loadScript(EPUB_URL);
-  if (capability.mode === "image") return new Promise((resolve, reject) => { const image = new Image(); image.className = "reader-image"; image.alt = title; image.decoding = "async"; image.onload = () => resolve(image); image.onerror = reject; image.src = sourceUrl; });
+  if (capability.mode === "image") return new Promise((resolve, reject) => { const image = new Image(); image.className = "reader-image"; image.alt = title; image.decoding = "async"; let fallback = false; image.onload = () => resolve(image); image.onerror = () => { if (!fallback) { fallback = true; image.src = sourceUrl; } else reject(new Error("image load failed")); }; image.src = contentUrl; });
   return Promise.resolve(null);
 }
 start();