fix: retain original image titles when proxying previews

server/src/main/resources/web/picture.ftl

@@ -77,16 +77,9 @@
             button: false,
             backdrop: false,
             loop: true,
-            // #787: Viewer.js 的 title 回调拿到的 `image` 是它内部新建的 <img>（见 viewer.min.js
-            // 的 view(): `var image = document.createElement('img')`），并不是原始 <div>。Viewer
-            // 在构建缩略图与查看大图时只透传 `inheritedAttributes` 里的属性，而默认值不含
-            // data-original-url，所以若不显式加入，getImageNameFromOriginalUrl 在该 <img> 上永远
-            // getAttribute('data-original-url') == null，标题会恒为 'image'（修复形同虚设）。
-            // 因此必须把 data-original-url 加进 inheritedAttributes，让原始 URL 随缩略图→大图透传。
-            inheritedAttributes: ['crossOrigin', 'decoding', 'isMap', 'loading', 'referrerPolicy', 'sizes', 'srcset', 'useMap', 'data-original-url'],
-            // 从 data-original-url 派生标题文件名（避免受反代 / CORS 代理 URL 影响）
-            title: function (image, imageData) {
-                return getImageNameFromOriginalUrl(image);
+            // Viewer 会将克隆图片的 data-original-url 改为加载地址，因此从原始元素读取标题。
+            title: function () {
+                return getImageNameFromOriginalUrl(this.images[this.index]);
             }
         });
         viewer.view(0); // 0 是图片的索引，如果你想点击第一张图片，索引为 0

server/src/test/java/cn/keking/PictureFilePreviewTests.java

@@ -16,10 +16,8 @@ import static org.junit.jupiter.api.Assertions.assertTrue;
  * src 属性，Viewer.js 用 image.src 取标题得到 undefined，导致标题为空。修复方式是在 Viewer 初始化时
  * 配置 title 函数，从 data-original-url 派生文件名。
  *
- * 关键点（已核对 viewer.min.js 源码）：title 回调拿到的 `image` 是 Viewer 内部新建的 <img>
- * （view(): `var image = document.createElement('img')`），不是原始 <div>。Viewer 在构建缩略图
- * 与查看大图时只透传 `inheritedAttributes` 里的属性，默认值不含 data-original-url，所以必须把
- * data-original-url 加进 inheritedAttributes，否则 title 函数永远读不到它、标题恒为 'image'。
+ * Viewer 会将内部克隆图片的 data-original-url 改为实际加载地址（可能是代理地址），
+ * 标题必须读取 this.images[this.index] 中保留原始 URL 的元素。
  */
 public class PictureFilePreviewTests {
 
@@ -41,12 +39,8 @@ public class PictureFilePreviewTests {
         assertTrue(pictureTemplate.contains("getAttribute('data-original-url')"),
                 () -> "title derivation must read data-original-url attribute (see #787)");
 
-        // 关键：Viewer.js 只会把 inheritedAttributes 透传到 title 回调拿到的 <img> 上，默认值不含
-        // data-original-url。若不显式加入，title 函数读不到原始 URL、标题恒为 'image'（修复形同虚设）。
-        assertTrue(pictureTemplate.contains("inheritedAttributes"),
-                () -> "picture.ftl must set Viewer inheritedAttributes so data-original-url reaches the title image (see #787)");
-        assertTrue(pictureTemplate.contains("'data-original-url'"),
-                () -> "Viewer inheritedAttributes must include data-original-url (see #787)");
+        assertTrue(pictureTemplate.contains("getImageNameFromOriginalUrl(this.images[this.index])"),
+                () -> "Viewer title must use the original element rather than its proxy-backed clone (see #787)");
     }
 
     private String readResource(String resourcePath) throws IOException {

tests/e2e/specs/picture-title.spec.ts

@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test';
+
+const fixtureBase = process.env.FIXTURE_BASE_URL || 'http://127.0.0.1:18080';
+
+for (const proxy of [false, true]) {
+  test(`image title retains the source filename with kkagent=${proxy}`, async ({ page }) => {
+    const source = `${fixtureBase}/sample.png`;
+    const encoded = encodeURIComponent(Buffer.from(source).toString('base64'));
+    const response = await page.goto(`/onlinePreview?url=${encoded}&kkagent=${proxy}`);
+
+    expect(response?.status()).toBe(200);
+    await expect(page.locator('.viewer-title')).toHaveText('sample.png');
+  });
+}