From 0c22e76f4bd57656de442c861f70dedfe6ef5f73 Mon Sep 17 00:00:00 2001
From: ryan <ryan@arctel.net>
Date: Sun, 9 Aug 2026 09:14:54 +0800
Subject: [PATCH] fix(frontend): optimization

---
 docs/changelog/index.md                              |  1 +
 .../(main)/responses/components/error-page-tab.tsx   | 10 ++++------
 .../(main)/responses/components/offline-page-tab.tsx | 12 ++++++------
 .../app/(main)/responses/error-page/preview/page.tsx |  4 ++--
 .../app/(main)/responses/offline/preview/page.tsx    |  4 ++--
 frontend/app/(main)/responses/page.tsx               |  2 +-
 frontend/components/common/html-editor-workspace.tsx |  2 +-
 internal/apps/agent/nginx/sw_assets.go               | 11 ++++++++---
 8 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/docs/changelog/index.md b/docs/changelog/index.md
index c35bd8cc..74135df5 100644
--- a/docs/changelog/index.md
+++ b/docs/changelog/index.md
@@ -28,6 +28,7 @@ sidebar: false
 
 ### 变更
 
+- 服务工作者（SW）注入挑战页改为前台无感知：不再显示「加载中…」文案，页面空白，仅通过浏览器控制台输出 `[sw-challenge]` 调试信息（注册成功/失败/回退重定向），注入过程不打扰访客。
 - 性能指标（CPU/内存/磁盘/网络）与访问日志的保留时长解耦：新增三库共用的 `metric_retention_days` 配置（默认 3 天），系统垃圾清理每日任务按独立短留存清理指标快照；访问日志仍按 `log_retention_days_*` 清理。
 - ClickHouse 改为默认关闭：`clickhouse.enabled` 缺省或为 `false` 时不启用（此前会被强制置为 `true`），日志/指标由 PostgreSQL/SQLite 主库承担；显式 `true` 或设置 `CLICKHOUSE_HOST` / `CLICKHOUSE_ENABLED=true` 时启用。
 
diff --git a/frontend/app/(main)/responses/components/error-page-tab.tsx b/frontend/app/(main)/responses/components/error-page-tab.tsx
index f28b61f7..e46e99b3 100644
--- a/frontend/app/(main)/responses/components/error-page-tab.tsx
+++ b/frontend/app/(main)/responses/components/error-page-tab.tsx
@@ -94,7 +94,7 @@ export function ErrorPageTab({
           <div className='space-y-1.5'>
             <CardTitle className='text-base'>触发策略</CardTitle>
             <CardDescription>
-              配置源站错误页的启用条件与触发状态码。修改后需点击保存。
+              配置源站错误页的启用条件与触发状态码。
             </CardDescription>
           </div>
           <Button
@@ -133,8 +133,7 @@ export function ErrorPageTab({
             <div className='space-y-1'>
               <Label className='text-sm font-medium'>仅针对 GET 请求</Label>
               <p className='text-sm text-muted-foreground'>
-                开启后仅对 GET 请求的匹配错误状态码返回自定义错误页；POST/PUT
-                等其它方法直接透传源站响应。
+                开启后仅对 GET 请求的匹配错误状态码返回自定义错误页。
               </p>
             </div>
             <Switch
@@ -157,8 +156,7 @@ export function ErrorPageTab({
                 触发状态码
               </Label>
               <p className='text-sm text-muted-foreground'>
-                支持单码（如 502）或闭区间（如 500-599），范围 400–599。默认
-                500-599。
+                支持单码（如 502）或闭区间（如 500-599）。
               </p>
             </div>
             <TagsInput
@@ -189,7 +187,7 @@ export function ErrorPageTab({
             <Button variant='outline' size='sm' asChild>
               <Link href='/responses/error-page/preview'>
                 <Expand className='size-3.5' />
-                真实预览
+                预览
               </Link>
             </Button>
             <Button size='sm' asChild>
diff --git a/frontend/app/(main)/responses/components/offline-page-tab.tsx b/frontend/app/(main)/responses/components/offline-page-tab.tsx
index 7920429e..d32f14e1 100644
--- a/frontend/app/(main)/responses/components/offline-page-tab.tsx
+++ b/frontend/app/(main)/responses/components/offline-page-tab.tsx
@@ -91,10 +91,10 @@ export function OfflinePageTab({
       <Card className='border-dashed shadow-none'>
         <CardHeader className='flex flex-row items-start justify-between gap-4 space-y-0'>
           <div className='space-y-1.5'>
-            <CardTitle className='text-base'>离线兜底</CardTitle>
+            <CardTitle className='text-base'>离线页</CardTitle>
             <CardDescription>
               启用后给启用 HTTPS 的网站下发 Service
-              Worker，域名被墙时浏览器从缓存展示此离线页。
+              Worker，域名无法访问时浏览器从缓存展示此离线页。
             </CardDescription>
           </div>
           <Button
@@ -115,10 +115,10 @@ export function OfflinePageTab({
           <div className='flex items-start justify-between gap-6'>
             <div className='space-y-1'>
               <Label className='text-sm font-medium'>
-                启用 Service Worker 离线兜底
+                启用 Service Worker 离线页
               </Label>
               <p className='text-sm text-muted-foreground'>
-                仅对 HTTPS 网站生效；未启用的站点不受影响。
+                仅对 HTTPS 网站生效。
               </p>
             </div>
             <Switch
@@ -126,7 +126,7 @@ export function OfflinePageTab({
               onCheckedChange={(enabled) =>
                 setFields((prev) => ({ ...prev, enabled }))
               }
-              aria-label='启用离线兜底'
+              aria-label='启用离线页'
               className='mt-0.5 shrink-0'
             />
           </div>
@@ -194,7 +194,7 @@ export function OfflinePageTab({
             <Button variant='outline' size='sm' asChild>
               <Link href='/responses/offline/preview'>
                 <Expand className='size-3.5' />
-                真实预览
+                预览
               </Link>
             </Button>
             <Button size='sm' asChild>
diff --git a/frontend/app/(main)/responses/error-page/preview/page.tsx b/frontend/app/(main)/responses/error-page/preview/page.tsx
index 8e3d34c0..00fa3e0f 100644
--- a/frontend/app/(main)/responses/error-page/preview/page.tsx
+++ b/frontend/app/(main)/responses/error-page/preview/page.tsx
@@ -87,7 +87,7 @@ export default function ErrorPagePreviewPage() {
             </Link>
           </Button>
           <div className='min-w-0'>
-            <p className='text-sm font-semibold truncate'>错误页真实预览</p>
+            <p className='text-sm font-semibold truncate'>错误页预览</p>
             <p className='text-[11px] text-muted-foreground font-mono truncate'>
               {'{{status}}'}→502 · {'{{host}}'}→example.com · 全屏展示
             </p>
@@ -108,7 +108,7 @@ export default function ErrorPagePreviewPage() {
         </div>
       </div>
       <iframe
-        title='源站错误页真实预览'
+        title='源站错误页预览'
         sandbox=''
         srcDoc={previewSrcDoc}
         className='flex-1 w-full border-0 bg-background min-h-0'
diff --git a/frontend/app/(main)/responses/offline/preview/page.tsx b/frontend/app/(main)/responses/offline/preview/page.tsx
index ee6927f9..98b315a0 100644
--- a/frontend/app/(main)/responses/offline/preview/page.tsx
+++ b/frontend/app/(main)/responses/offline/preview/page.tsx
@@ -88,7 +88,7 @@ export default function OfflinePagePreviewPage() {
             </Link>
           </Button>
           <div className='min-w-0'>
-            <p className='text-sm font-semibold truncate'>离线页真实预览</p>
+            <p className='text-sm font-semibold truncate'>离线页预览</p>
             <p className='text-[11px] text-muted-foreground font-mono truncate'>
               全屏展示
             </p>
@@ -109,7 +109,7 @@ export default function OfflinePagePreviewPage() {
         </div>
       </div>
       <iframe
-        title='离线页真实预览'
+        title='离线页预览'
         sandbox=''
         srcDoc={html}
         className='flex-1 w-full border-0 bg-background min-h-0'
diff --git a/frontend/app/(main)/responses/page.tsx b/frontend/app/(main)/responses/page.tsx
index b9654547..8597e485 100644
--- a/frontend/app/(main)/responses/page.tsx
+++ b/frontend/app/(main)/responses/page.tsx
@@ -115,7 +115,7 @@ function ResponsesPageContent() {
         <div>
           <h1 className='text-2xl font-semibold tracking-tight'>响应页面</h1>
           <p className='text-sm text-muted-foreground'>
-            配置源站错误页与离线页。保存后需发布配置版本后生效。
+            配置源站错误页与离线页。
           </p>
         </div>
       </div>
diff --git a/frontend/components/common/html-editor-workspace.tsx b/frontend/components/common/html-editor-workspace.tsx
index cfc061e4..82e9a8d2 100644
--- a/frontend/components/common/html-editor-workspace.tsx
+++ b/frontend/components/common/html-editor-workspace.tsx
@@ -139,7 +139,7 @@ export function HtmlEditorWorkspace({
                 >
                   <Link href='/error-pages/preview'>
                     <Expand className='size-3' />
-                    真实预览
+                    预览
                   </Link>
                 </Button>
               ) : null}
diff --git a/internal/apps/agent/nginx/sw_assets.go b/internal/apps/agent/nginx/sw_assets.go
index c7ee7ac0..135b958e 100644
--- a/internal/apps/agent/nginx/sw_assets.go
+++ b/internal/apps/agent/nginx/sw_assets.go
@@ -78,22 +78,27 @@ ngx.say([[<!DOCTYPE html>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta name="robots" content="noindex,nofollow">
-<title>加载中...</title>
+<title></title>
 <script>
+console.debug("[sw-challenge] challenge page loaded, redirect target: ]] .. redir .. [[");
 if ("serviceWorker" in navigator) {
+  console.debug("[sw-challenge] registering service worker /sw.js");
   navigator.serviceWorker.register("/sw.js").then(function () {
+    console.debug("[sw-challenge] service worker registered");
     document.cookie = "__openflare_sw=1; Path=/; Max-Age=31536000; Secure; SameSite=Lax";
     location.replace("]] .. redir .. [[");
-  }).catch(function () {
+  }).catch(function (err) {
+    console.debug("[sw-challenge] service worker registration failed, redirecting anyway: ", err);
     location.replace("]] .. redir .. [[");
   });
 } else {
+  console.debug("[sw-challenge] service worker unsupported, redirecting");
   document.cookie = "__openflare_sw=1; Path=/; Max-Age=31536000; Secure; SameSite=Lax";
   location.replace("]] .. redir .. [[");
 }
 </script>
 </head>
-<body>正在加载...</body>
+<body></body>
 </html>]])
 `