From 62e0c12d81b5bbb123b473e0a41b4fe2ffab78b9 Mon Sep 17 00:00:00 2001
From: ShiGuangAlex <ShiGuangAlex@outlook.com>
Date: Tue, 14 Apr 2026 17:40:30 +0800
Subject: [PATCH] Fix Safari playback recovery and episode progress memory

---
 src/app/admin/page.tsx             |  31 ++
 src/app/api/server-config/route.ts |   2 +
 src/app/layout.tsx                 |   3 +
 src/app/play/page.tsx              | 466 ++++++++++++++++++++++++++---
 src/components/EpisodeSelector.tsx |  71 ++++-
 src/components/UserMenu.tsx        |  15 +-
 src/lib/admin.types.ts             |   1 +
 src/lib/config.ts                  |   5 +
 src/lib/db.client.ts               |  19 +-
 9 files changed, 556 insertions(+), 57 deletions(-)

diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx
index 263c6ff..d5ce9d3 100644
--- a/src/app/admin/page.tsx
+++ b/src/app/admin/page.tsx
@@ -344,6 +344,7 @@ interface SiteConfig {
   DanmakuSourceType?: 'builtin' | 'custom';
   DanmakuApiBase: string;
   DanmakuApiToken: string;
+  DanmakuAutoLoadDefault?: boolean;
   TMDBApiKey?: string;
   TMDBProxy?: string;
   TMDBReverseProxy?: string;
@@ -7799,6 +7800,7 @@ const SiteConfigComponent = ({
     DanmakuSourceType: 'builtin',
     DanmakuApiBase: 'https://mtvpls-danmu.netlify.app/87654321',
     DanmakuApiToken: '87654321',
+    DanmakuAutoLoadDefault: true,
     TMDBApiKey: '',
     TMDBProxy: '',
     TMDBReverseProxy: '',
@@ -7896,6 +7898,7 @@ const SiteConfigComponent = ({
         DanmakuApiBase:
           config.SiteConfig.DanmakuApiBase || 'http://localhost:9321',
         DanmakuApiToken: config.SiteConfig.DanmakuApiToken || '87654321',
+        DanmakuAutoLoadDefault: config.SiteConfig.DanmakuAutoLoadDefault !== false,
         TMDBApiKey: config.SiteConfig.TMDBApiKey || '',
         TMDBProxy: config.SiteConfig.TMDBProxy || '',
         TMDBReverseProxy: config.SiteConfig.TMDBReverseProxy || '',
@@ -8538,6 +8541,34 @@ const SiteConfigComponent = ({
               </div>
             </>
           )}
+
+          <div className='flex items-center justify-between'>
+            <div>
+              <h4 className='text-sm font-medium text-gray-700 dark:text-gray-300'>
+                默认自动加载弹幕
+              </h4>
+              <p className='text-xs text-gray-500 dark:text-gray-400 mt-1'>
+                新用户或未设置本地偏好时，播放页是否默认自动匹配并加载弹幕。用户仍可在个人设置中自行覆盖。
+              </p>
+            </div>
+            <label className='flex items-center cursor-pointer'>
+              <div className='relative'>
+                <input
+                  type='checkbox'
+                  className='sr-only peer'
+                  checked={siteSettings.DanmakuAutoLoadDefault !== false}
+                  onChange={() =>
+                    setSiteSettings((prev) => ({
+                      ...prev,
+                      DanmakuAutoLoadDefault: prev.DanmakuAutoLoadDefault === false,
+                    }))
+                  }
+                />
+                <div className='w-11 h-6 bg-gray-300 rounded-full peer-checked:bg-green-500 transition-colors dark:bg-gray-600'></div>
+                <div className='absolute top-0.5 left-0.5 w-5 h-5 bg-white rounded-full transition-transform peer-checked:translate-x-5'></div>
+              </div>
+            </label>
+          </div>
         </div>
       </details>
 
diff --git a/src/app/api/server-config/route.ts b/src/app/api/server-config/route.ts
index f9b9ff0..0f1380a 100644
--- a/src/app/api/server-config/route.ts
+++ b/src/app/api/server-config/route.ts
@@ -38,6 +38,7 @@ export async function GET(request: NextRequest) {
       Version: CURRENT_VERSION,
       WatchRoom: watchRoomConfig,
       EnableOfflineDownload: process.env.NEXT_PUBLIC_ENABLE_OFFLINE_DOWNLOAD === 'true',
+      DanmakuAutoLoadDefault: true,
     });
   }
 
@@ -57,6 +58,7 @@ export async function GET(request: NextRequest) {
     EnableOIDCLogin: config.SiteConfig.EnableOIDCLogin || false,
     EnableOIDCRegistration: config.SiteConfig.EnableOIDCRegistration || false,
     OIDCButtonText: config.SiteConfig.OIDCButtonText || '',
+    DanmakuAutoLoadDefault: config.SiteConfig.DanmakuAutoLoadDefault !== false,
     loginBackgroundImage: config.ThemeConfig?.loginBackgroundImage || '',
     registerBackgroundImage: config.ThemeConfig?.registerBackgroundImage || '',
     progressThumbType: config.ThemeConfig?.progressThumbType || 'default',
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 22eb3a6..2a15faf 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -64,6 +64,7 @@ export default async function RootLayout({
     process.env.NEXT_PUBLIC_DISABLE_YELLOW_FILTER === 'true';
   let fluidSearch = process.env.NEXT_PUBLIC_FLUID_SEARCH !== 'false';
   let enableComments = false;
+  let danmakuAutoLoadDefault = true;
   let recommendationDataSource = 'Mixed';
   let tmdbApiKey = '';
   let openListEnabled = false;
@@ -118,6 +119,7 @@ export default async function RootLayout({
     }));
     fluidSearch = config.SiteConfig.FluidSearch;
     enableComments = config.SiteConfig.EnableComments;
+    danmakuAutoLoadDefault = config.SiteConfig.DanmakuAutoLoadDefault !== false;
     recommendationDataSource = config.SiteConfig.RecommendationDataSource || 'Mixed';
     tmdbApiKey = config.SiteConfig.TMDBApiKey || '';
     loginBackgroundImage = config.ThemeConfig?.loginBackgroundImage || '';
@@ -183,6 +185,7 @@ export default async function RootLayout({
     CUSTOM_CATEGORIES: customCategories,
     FLUID_SEARCH: fluidSearch,
     EnableComments: enableComments,
+    DANMAKU_AUTO_LOAD_DEFAULT: danmakuAutoLoadDefault,
     RecommendationDataSource: recommendationDataSource,
     ENABLE_TVBOX_SUBSCRIBE: process.env.ENABLE_TVBOX_SUBSCRIBE === 'true',
     ENABLE_OFFLINE_DOWNLOAD: process.env.NEXT_PUBLIC_ENABLE_OFFLINE_DOWNLOAD === 'true',
diff --git a/src/app/play/page.tsx b/src/app/play/page.tsx
index 6ceff05..0baaedd 100644
--- a/src/app/play/page.tsx
+++ b/src/app/play/page.tsx
@@ -672,10 +672,9 @@ function PlayPageClient() {
       }
     }
 
-    // 如果不是首次检查，标记为已关闭，不再显示跳转按钮
-    if (!playRecordJumpInitialCheckRef.current) {
-      playRecordJumpDismissedRef.current = true;
-    }
+    // 切到新的一集后，重新允许检查该集是否存在播放记录。
+    playRecordJumpInitialCheckRef.current = true;
+    playRecordJumpDismissedRef.current = false;
   }, [currentEpisodeIndex]);
 
   // 监听 URL 参数变化，当切换到不同视频时重新加载页面
@@ -1534,6 +1533,94 @@ function PlayPageClient() {
     ? directEpisodeLabel
     : `第${currentEpisodeIndex + 1}集`;
 
+  const loadSavedPlaybackRate = () => {
+    if (typeof window === 'undefined') {
+      return 1.0;
+    }
+
+    const raw = localStorage.getItem('preferredPlaybackRate');
+    const parsed = raw ? Number(raw) : 1;
+    return Number.isFinite(parsed) && parsed > 0 ? parsed : 1.0;
+  };
+
+  const persistPlaybackRate = (rate: number) => {
+    if (typeof window === 'undefined' || !Number.isFinite(rate) || rate <= 0) {
+      return;
+    }
+
+    localStorage.setItem('preferredPlaybackRate', String(rate));
+  };
+
+  const isDanmakuAutoLoadDisabled = () => {
+    if (typeof window === 'undefined') {
+      return false;
+    }
+
+    const saved = localStorage.getItem('disableAutoLoadDanmaku');
+    if (saved !== null) {
+      return saved === 'true';
+    }
+
+    return (window as any).RUNTIME_CONFIG?.DANMAKU_AUTO_LOAD_DEFAULT === false;
+  };
+
+  const getEpisodeProgressStorageKey = (
+    source: string,
+    id: string,
+    episodeIndex: number
+  ) => `moontv_episode_progress:${source}+${id}:${episodeIndex}`;
+
+  const loadLocalEpisodeProgress = (
+    source: string,
+    id: string,
+    episodeIndex: number
+  ): number | null => {
+    if (typeof window === 'undefined') {
+      return null;
+    }
+
+    try {
+      const raw = localStorage.getItem(
+        getEpisodeProgressStorageKey(source, id, episodeIndex)
+      );
+      if (!raw) {
+        return null;
+      }
+
+      const parsed = JSON.parse(raw) as { playTime?: number };
+      const playTime = Number(parsed.playTime);
+      return Number.isFinite(playTime) && playTime > 1 ? playTime : null;
+    } catch (error) {
+      console.warn('[Play] Failed to load local episode progress:', error);
+      return null;
+    }
+  };
+
+  const saveLocalEpisodeProgress = (
+    source: string,
+    id: string,
+    episodeIndex: number,
+    playTime: number,
+    totalTime: number
+  ) => {
+    if (typeof window === 'undefined' || !Number.isFinite(playTime) || playTime <= 0) {
+      return;
+    }
+
+    try {
+      localStorage.setItem(
+        getEpisodeProgressStorageKey(source, id, episodeIndex),
+        JSON.stringify({
+          playTime: Math.floor(playTime),
+          totalTime: Math.floor(totalTime),
+          updatedAt: Date.now(),
+        })
+      );
+    } catch (error) {
+      console.warn('[Play] Failed to save local episode progress:', error);
+    }
+  };
+
   // 用于记录是否需要在播放器 ready 后跳转到指定进度
   const resumeTimeRef = useRef<number | null>(null);
   // 播放记录跳转按钮状态
@@ -1543,7 +1630,9 @@ function PlayPageClient() {
   // 上次使用的音量，默认 0.7
   const lastVolumeRef = useRef<number>(0.7);
   // 上次使用的播放速率，默认 1.0
-  const lastPlaybackRateRef = useRef<number>(1.0);
+  const lastPlaybackRateRef = useRef<number>(loadSavedPlaybackRate());
+  // Safari 切集时会短暂把 playbackRate 重置为 1，这里保留一段恢复窗口避免污染记忆值
+  const playbackRateRestoreWindowUntilRef = useRef<number>(0);
 
   // 换源相关状态
   const [availableSources, setAvailableSources] = useState<SearchResult[]>([]);
@@ -2665,13 +2754,25 @@ function PlayPageClient() {
   const ensureVideoSource = (video: HTMLVideoElement | null, url: string) => {
     if (!video || !url) return;
     const sources = Array.from(video.getElementsByTagName('source'));
-    const existed = sources.some((s) => s.src === url);
-    if (!existed) {
-      // 移除旧的 source，保持唯一
+    const isHlsLikeSource =
+      !!(video as any).hls ||
+      /\.m3u8?($|\?)/i.test(url) ||
+      url.includes('/api/proxy-m3u8') ||
+      url.includes('/api/proxy/vod/m3u8');
+
+    if (isHlsLikeSource) {
+      // HLS 由 hls.js 接管时，不能再给 <video> 塞原始 m3u8 source，
+      // 否则 Safari 可能切回原生 HLS，和 MSE/hls.js 抢同一个播放器。
       sources.forEach((s) => s.remove());
-      const sourceEl = document.createElement('source');
-      sourceEl.src = url;
-      video.appendChild(sourceEl);
+    } else {
+      const existed = sources.some((s) => s.src === url);
+      if (!existed) {
+        // 移除旧的 source，保持唯一
+        sources.forEach((s) => s.remove());
+        const sourceEl = document.createElement('source');
+        sourceEl.src = url;
+        video.appendChild(sourceEl);
+      }
     }
 
     // 始终允许远程播放（AirPlay / Cast）
@@ -3856,6 +3957,12 @@ function PlayPageClient() {
             } else {
               // 否则使用点击的文件集数，从头开始播放
               initialIndex = detailData.initialEpisodeIndex;
+              const localEpisodeTime = loadLocalEpisodeProgress(
+                detailData.source,
+                detailData.id,
+                initialIndex
+              );
+              resumeTimeRef.current = localEpisodeTime;
               console.log('[Play] 使用点击的文件集数:', initialIndex);
             }
           } else {
@@ -3870,10 +3977,20 @@ function PlayPageClient() {
           if (detailData.initialEpisodeIndex !== undefined) {
             // 使用点击的文件集数
             initialIndex = detailData.initialEpisodeIndex;
+            resumeTimeRef.current = loadLocalEpisodeProgress(
+              detailData.source,
+              detailData.id,
+              initialIndex
+            );
             console.log('[Play] 没有播放记录，使用点击的文件集数:', initialIndex);
           } else {
             // 默认从第0集开始
             initialIndex = 0;
+            resumeTimeRef.current = loadLocalEpisodeProgress(
+              detailData.source,
+              detailData.id,
+              initialIndex
+            );
             console.log('[Play] 没有播放记录，从第0集开始');
           }
         }
@@ -4196,31 +4313,73 @@ function PlayPageClient() {
   // ---------------------------------------------------------------------------
   // 集数切换
   // ---------------------------------------------------------------------------
-  // 处理集数切换
-  const handleEpisodeChange = (episodeNumber: number) => {
-    if (episodeNumber >= 0 && episodeNumber < totalEpisodes) {
-      // 在更换集数前保存当前播放进度
-      if (artPlayerRef.current && artPlayerRef.current.paused) {
-        saveCurrentPlayProgress();
+  const primeEpisodeResumeState = async (targetEpisodeIndex: number) => {
+    if (!currentSourceRef.current || !currentIdRef.current) {
+      resumeTimeRef.current = null;
+      return;
+    }
+
+    try {
+      const allRecords = await getAllPlayRecords();
+      const key = generateStorageKey(currentSourceRef.current, currentIdRef.current);
+      const record = allRecords[key];
+
+      if (record && record.index - 1 === targetEpisodeIndex && record.play_time > 1) {
+        resumeTimeRef.current = record.play_time;
+      } else {
+        resumeTimeRef.current = loadLocalEpisodeProgress(
+          currentSourceRef.current,
+          currentIdRef.current,
+          targetEpisodeIndex
+        );
       }
-      setVideoLoadingStage('episodeChanging');
-      setIsVideoLoading(true);
-      setVideoError(null);
+    } catch (error) {
+      console.warn('[Play] Failed to prime episode resume state:', error);
+      if (currentSourceRef.current && currentIdRef.current) {
+        resumeTimeRef.current = loadLocalEpisodeProgress(
+          currentSourceRef.current,
+          currentIdRef.current,
+          targetEpisodeIndex
+        );
+      } else {
+        resumeTimeRef.current = null;
+      }
+    }
+  };
+
+  const prepareEpisodeSwitch = async () => {
+    if (artPlayerRef.current) {
+      lastPlaybackRateRef.current =
+        artPlayerRef.current.playbackRate || lastPlaybackRateRef.current;
+      lastVolumeRef.current =
+        artPlayerRef.current.volume || lastVolumeRef.current;
+      playbackRateRestoreWindowUntilRef.current = Date.now() + 8000;
+
+      await saveCurrentPlayProgress();
+    }
+
+    setVideoLoadingStage('episodeChanging');
+    setIsVideoLoading(true);
+    setVideoError(null);
+  };
+
+  // 处理集数切换
+  const handleEpisodeChange = async (episodeNumber: number) => {
+    if (episodeNumber >= 0 && episodeNumber < totalEpisodes) {
+      await prepareEpisodeSwitch();
+      await primeEpisodeResumeState(episodeNumber);
       setCurrentEpisodeIndex(episodeNumber);
     }
   };
 
-  const handlePreviousEpisode = () => {
+  const handlePreviousEpisode = async () => {
     const d = detailRef.current;
     const idx = currentEpisodeIndexRef.current;
     if (d && d.episodes && idx > 0) {
-      if (artPlayerRef.current && !artPlayerRef.current.paused) {
-        saveCurrentPlayProgress();
-      }
-      setVideoLoadingStage('episodeChanging');
-      setIsVideoLoading(true);
-      setVideoError(null);
-      setCurrentEpisodeIndex(idx - 1);
+      await prepareEpisodeSwitch();
+      const targetIndex = idx - 1;
+      await primeEpisodeResumeState(targetIndex);
+      setCurrentEpisodeIndex(targetIndex);
     }
   };
 
@@ -4248,7 +4407,7 @@ function PlayPageClient() {
     return false;
   };
 
-  const handleNextEpisode = () => {
+  const handleNextEpisode = async () => {
     const d = detailRef.current;
     const idx = currentEpisodeIndexRef.current;
 
@@ -4256,11 +4415,6 @@ function PlayPageClient() {
       return;
     }
 
-    // 保存当前进度
-    if (artPlayerRef.current && !artPlayerRef.current.paused) {
-      saveCurrentPlayProgress();
-    }
-
     // 查找下一个未被过滤的集数
     let nextIdx = idx + 1;
     while (nextIdx < d.episodes.length) {
@@ -4268,9 +4422,8 @@ function PlayPageClient() {
       const isFiltered = episodeTitle && isEpisodeFilteredByTitle(episodeTitle);
 
       if (!isFiltered) {
-        setVideoLoadingStage('episodeChanging');
-        setIsVideoLoading(true);
-        setVideoError(null);
+        await prepareEpisodeSwitch();
+        await primeEpisodeResumeState(nextIdx);
         setCurrentEpisodeIndex(nextIdx);
         return;
       }
@@ -4908,7 +5061,7 @@ function PlayPageClient() {
   // 自动搜索并加载弹幕
   const autoSearchDanmaku = async () => {
     if (isDirectPlay) return;
-    const disableAutoLoad = localStorage.getItem('disableAutoLoadDanmaku') === 'true';
+    const disableAutoLoad = isDanmakuAutoLoadDisabled();
     if (disableAutoLoad) return;
 
     const title = videoTitleRef.current;
@@ -5238,6 +5391,14 @@ function PlayPageClient() {
     }
 
     try {
+      saveLocalEpisodeProgress(
+        currentSourceRef.current,
+        currentIdRef.current,
+        currentEpisodeIndexRef.current,
+        currentTime,
+        duration
+      );
+
       await savePlayRecord(currentSourceRef.current, currentIdRef.current, {
         title: videoTitleRef.current,
         source_name: detailRef.current?.source_name || '',
@@ -5548,11 +5709,77 @@ function PlayPageClient() {
         const Hls = HlsModule.default;
         const artplayerPluginDanmuku = DanmukuPlugin.default as any;
 
+        const syncPlaybackPitch = () => {
+          if (!isWebkit || !artPlayerRef.current?.video) {
+            return;
+          }
+
+          const video = artPlayerRef.current.video as HTMLVideoElement & {
+            webkitPreservesPitch?: boolean;
+          };
+          const playbackRate = artPlayerRef.current.playbackRate || 1;
+          const shouldPreservePitch = playbackRate <= 2;
+
+          if ('preservesPitch' in video) {
+            video.preservesPitch = shouldPreservePitch;
+          }
+          if ('webkitPreservesPitch' in video) {
+            video.webkitPreservesPitch = shouldPreservePitch;
+          }
+        };
+
+        const rescueWebkitHlsBootstrap = (
+          reason: string,
+          retryDelays: number[] = [1500, 3500, 6000]
+        ) => {
+          if (!isWebkit || !artPlayerRef.current?.video) {
+            return;
+          }
+
+          const video = artPlayerRef.current.video as HTMLVideoElement & {
+            hls?: {
+              detachMedia?: () => void;
+              attachMedia?: (video: HTMLVideoElement) => void;
+              startLoad?: (startPosition?: number) => void;
+            };
+          };
+
+          retryDelays.forEach((delay) => {
+            window.setTimeout(() => {
+              if (!artPlayerRef.current || artPlayerRef.current.video !== video) {
+                return;
+              }
+
+              const hls = video.hls;
+              const currentSrc = video.currentSrc || video.src || '';
+
+              if (!hls || currentSrc || video.readyState > 0) {
+                return;
+              }
+
+              console.warn(
+                `[HLS] Safari bootstrap rescue triggered (${reason}, ${delay}ms)`
+              );
+
+              try {
+                hls.detachMedia?.();
+                hls.attachMedia?.(video);
+                hls.startLoad?.(-1);
+                video.play().catch((error) => {
+                  console.warn('[HLS] Safari rescue play failed:', error);
+                });
+              } catch (error) {
+                console.warn('[HLS] Safari bootstrap rescue failed:', error);
+              }
+            }, delay);
+          });
+        };
+
         // 创建自定义 HLS loader
         const CustomHlsJsLoader = createCustomHlsLoader(Hls);
 
         // 创建新的播放器实例
-        Artplayer.PLAYBACK_RATE = [0.5, 0.75, 1, 1.25, 1.5, 2, 3];
+        Artplayer.PLAYBACK_RATE = [0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4];
         Artplayer.USE_RAF = true;
 
         // 获取当前集的字幕
@@ -5685,7 +5912,9 @@ function PlayPageClient() {
               const hls = new Hls({
                 debug: false, // 关闭日志
                 enableWorker: true, // WebWorker 解码，降低主线程压力
-                lowLatencyMode: true, // 开启低延迟 LL-HLS
+                // 点播播放不需要 LL-HLS，小缓冲在 Safari 高倍速下更容易抖动。
+                lowLatencyMode: false,
+                autoStartLoad: true,
 
                 /* 缓冲/内存相关 - 根据用户设置的缓冲策略动态调整 */
                 maxBufferLength: bufferConfig.maxBufferLength, // 前向缓冲长度
@@ -5696,10 +5925,70 @@ function PlayPageClient() {
                 loader: loaderClass as any,
               });
 
+              const kickStartHlsPlayback = () => {
+                try {
+                  hls.startLoad(-1);
+                } catch (error) {
+                  console.warn('[HLS] startLoad failed:', error);
+                }
+
+                if (!video.paused) {
+                  video.play().catch((error) => {
+                    console.warn('[HLS] play after attach failed:', error);
+                  });
+                }
+              };
+
+              hls.on(Hls.Events.MEDIA_ATTACHED, () => {
+                kickStartHlsPlayback();
+              });
+
+              hls.on(Hls.Events.MEDIA_ATTACHED, () => {
+                if (!isWebkit) {
+                  return;
+                }
+
+                // Safari 偶发出现 media 已 attach 但 video.src 仍为空的状态。
+                // 这里延迟自检一次，必要时重新 attach，强制进入 blob: MSE 路径。
+                window.setTimeout(() => {
+                  const currentSrc = video.currentSrc || video.src || '';
+                  if (currentSrc) {
+                    return;
+                  }
+
+                  console.warn('[HLS] Safari attach watchdog triggered, reattaching media');
+                  try {
+                    hls.detachMedia();
+                    hls.attachMedia(video);
+                    kickStartHlsPlayback();
+                  } catch (error) {
+                    console.warn('[HLS] Safari reattach failed:', error);
+                  }
+                }, 1200);
+              });
+
               hls.loadSource(url);
               hls.attachMedia(video);
               video.hls = hls;
 
+              if (isWebkit) {
+                window.setTimeout(() => {
+                  const currentSrc = video.currentSrc || video.src || '';
+                  if (currentSrc) {
+                    return;
+                  }
+
+                  console.warn('[HLS] Safari post-attach watchdog triggered, forcing reattach');
+                  try {
+                    hls.detachMedia();
+                    hls.attachMedia(video);
+                    kickStartHlsPlayback();
+                  } catch (error) {
+                    console.warn('[HLS] Safari post-attach reattach failed:', error);
+                  }
+                }, 1200);
+              }
+
               ensureVideoSource(video, url);
 
               // 额外确保 iOS 内联播放属性（防止全屏时使用系统播放器）
@@ -5712,6 +6001,12 @@ function PlayPageClient() {
               hls.on(Hls.Events.MANIFEST_PARSED, () => {
                 console.log('[HLS] Manifest解析完成');
 
+                if (video.paused && (artPlayerRef.current?.option.autoplay || artPlayerRef.current?.loading)) {
+                  video.play().catch((error) => {
+                    console.warn('[HLS] play after manifest parsed failed:', error);
+                  });
+                }
+
                 // 只在首次加载时启动定时器（后续刷新会在refreshXiaoyaUrl中启动）
                 if (isInitialLoadRef.current && currentXiaoyaUrlRef.current && url.includes('.m3u8')) {
                   isInitialLoadRef.current = false; // 标记已完成首次加载
@@ -6552,6 +6847,8 @@ function PlayPageClient() {
         artPlayerRef.current.on('ready', async () => {
           setError(null);
 
+          rescueWebkitHlsBootstrap('player-ready');
+
           // 标记播放器已就绪，触发 usePlaySync 设置事件监听器
           setPlayerReady(true);
           console.log('[PlayPage] Player ready, triggering sync setup');
@@ -6886,7 +7183,43 @@ function PlayPageClient() {
           lastVolumeRef.current = artPlayerRef.current.volume;
         });
         artPlayerRef.current.on('video:ratechange', () => {
-          lastPlaybackRateRef.current = artPlayerRef.current.playbackRate;
+          const currentRate = artPlayerRef.current.playbackRate;
+          const shouldIgnoreSafariReset =
+            isWebkit &&
+            Date.now() < playbackRateRestoreWindowUntilRef.current &&
+            Math.abs(currentRate - 1) < 0.01 &&
+            lastPlaybackRateRef.current > 1;
+
+          if (shouldIgnoreSafariReset) {
+            // Safari 切集后可能偷偷回到 1x，这不是用户真实选择，不要覆盖记忆值。
+            setTimeout(() => {
+              if (
+                artPlayerRef.current &&
+                Math.abs(
+                  artPlayerRef.current.playbackRate - lastPlaybackRateRef.current
+                ) > 0.01
+              ) {
+                artPlayerRef.current.playbackRate = lastPlaybackRateRef.current;
+              }
+            }, 0);
+            syncPlaybackPitch();
+            return;
+          }
+
+          lastPlaybackRateRef.current = currentRate;
+          persistPlaybackRate(currentRate);
+          syncPlaybackPitch();
+        });
+        artPlayerRef.current.on('video:playing', () => {
+          if (
+            isWebkit &&
+            Date.now() < playbackRateRestoreWindowUntilRef.current &&
+            Math.abs(
+              artPlayerRef.current.playbackRate - lastPlaybackRateRef.current
+            ) > 0.01
+          ) {
+            artPlayerRef.current.playbackRate = lastPlaybackRateRef.current;
+          }
         });
 
         // 监听网页全屏事件，控制导航栏显示隐藏
@@ -7380,6 +7713,8 @@ function PlayPageClient() {
 
         // 监听视频可播放事件，这时恢复播放进度更可靠
         artPlayerRef.current.on('video:canplay', () => {
+          let restoredResumeTime = false;
+
           // 若存在需要恢复的播放进度，则跳转
           if (resumeTimeRef.current && resumeTimeRef.current > 0) {
             try {
@@ -7389,6 +7724,7 @@ function PlayPageClient() {
                 target = Math.max(0, duration - 5);
               }
               artPlayerRef.current.currentTime = target;
+              restoredResumeTime = true;
               console.log('成功恢复播放进度到:', resumeTimeRef.current);
             } catch (err) {
               console.warn('恢复播放进度失败:', err);
@@ -7397,19 +7733,53 @@ function PlayPageClient() {
           resumeTimeRef.current = null;
 
           setTimeout(() => {
+            const restorePlaybackRate = () => {
+              if (
+                Math.abs(
+                  artPlayerRef.current.playbackRate - lastPlaybackRateRef.current
+                ) > 0.01 &&
+                isWebkit
+              ) {
+                artPlayerRef.current.playbackRate = lastPlaybackRateRef.current;
+              }
+            };
+
             if (
               Math.abs(artPlayerRef.current.volume - lastVolumeRef.current) > 0.01
             ) {
               artPlayerRef.current.volume = lastVolumeRef.current;
             }
-            if (
-              Math.abs(
-                artPlayerRef.current.playbackRate - lastPlaybackRateRef.current
-              ) > 0.01 &&
-              isWebkit
-            ) {
-              artPlayerRef.current.playbackRate = lastPlaybackRateRef.current;
+
+            // Safari 在 seek 刚发生时立刻恢复 3x，容易卡进持续 seeking 状态。
+            // 这里等 seek 稳定后再恢复倍速，避免恢复进度和变速互相打架。
+            if (restoredResumeTime && isWebkit && artPlayerRef.current?.video) {
+              const video = artPlayerRef.current.video as HTMLVideoElement;
+              const applyRateAfterSeek = () => {
+                restorePlaybackRate();
+              };
+
+              if (video.seeking) {
+                const handleSeeked = () => {
+                  window.clearTimeout(seekedTimeout);
+                  applyRateAfterSeek();
+                };
+                const seekedTimeout = window.setTimeout(() => {
+                  video.removeEventListener('seeked', handleSeeked);
+                  applyRateAfterSeek();
+                }, 300);
+
+                video.addEventListener(
+                  'seeked',
+                  handleSeeked,
+                  { once: true }
+                );
+              } else {
+                restorePlaybackRate();
+              }
+            } else {
+              restorePlaybackRate();
             }
+            syncPlaybackPitch();
             artPlayerRef.current.notice.show = '';
           }, 0);
 
diff --git a/src/components/EpisodeSelector.tsx b/src/components/EpisodeSelector.tsx
index 401bb8d..430711c 100644
--- a/src/components/EpisodeSelector.tsx
+++ b/src/components/EpisodeSelector.tsx
@@ -11,6 +11,7 @@ import React, {
 } from 'react';
 
 import type { DanmakuComment,DanmakuSelection } from '@/lib/danmaku/types';
+import { generateStorageKey, getCachedPlayRecordsSnapshot } from '@/lib/db.client';
 import { EpisodeFilterConfig,SearchResult } from '@/lib/types';
 import { getVideoResolutionFromM3u8 } from '@/lib/utils';
 
@@ -109,6 +110,7 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
   const [isRetestingAll, setIsRetestingAll] = useState(false);
   // 标记是否正在进行初始测速
   const [isInitialTesting, setIsInitialTesting] = useState(false);
+  const [watchedEpisodes, setWatchedEpisodes] = useState<Set<number>>(new Set());
 
   // 使用 ref 来避免闭包问题
   const attemptedSourcesRef = useRef<Set<string>>(new Set());
@@ -123,6 +125,62 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
     videoInfoMapRef.current = videoInfoMap;
   }, [videoInfoMap]);
 
+  useEffect(() => {
+    if (typeof window === 'undefined' || !currentSource || !currentId) {
+      setWatchedEpisodes(new Set());
+      return;
+    }
+
+    const readWatchedEpisodes = () => {
+      const watched = new Set<number>();
+
+      try {
+        const records = getCachedPlayRecordsSnapshot();
+        const record = records[generateStorageKey(currentSource, currentId)];
+        if (record && record.index > 0 && record.play_time > 1) {
+          watched.add(record.index);
+        }
+      } catch (error) {
+        console.warn('[EpisodeSelector] Failed to read cached play records:', error);
+      }
+
+      for (let episodeNumber = 1; episodeNumber <= totalEpisodes; episodeNumber++) {
+        try {
+          const raw = localStorage.getItem(
+            `moontv_episode_progress:${currentSource}+${currentId}:${episodeNumber - 1}`
+          );
+          if (!raw) continue;
+
+          const parsed = JSON.parse(raw) as { playTime?: number };
+          if (Number(parsed.playTime) > 1) {
+            watched.add(episodeNumber);
+          }
+        } catch (error) {
+          console.warn('[EpisodeSelector] Failed to read local episode progress:', error);
+        }
+      }
+
+      setWatchedEpisodes(watched);
+    };
+
+    readWatchedEpisodes();
+
+    const handlePlayRecordsUpdated = () => {
+      readWatchedEpisodes();
+    };
+
+    window.addEventListener('playRecordsUpdated', handlePlayRecordsUpdated as EventListener);
+    window.addEventListener('storage', handlePlayRecordsUpdated);
+
+    return () => {
+      window.removeEventListener(
+        'playRecordsUpdated',
+        handlePlayRecordsUpdated as EventListener
+      );
+      window.removeEventListener('storage', handlePlayRecordsUpdated);
+    };
+  }, [currentSource, currentId, totalEpisodes, value]);
+
   // 主要的 tab 状态：'danmaku' | 'episodes' | 'sources'
   // 默认显示选集选项卡，但如果是房员则显示弹幕
   const [activeTab, setActiveTab] = useState<'danmaku' | 'episodes' | 'sources'>(
@@ -723,16 +781,23 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
                 .filter(episodeNumber => !isEpisodeFiltered(episodeNumber))
                 .map((episodeNumber) => {
                   const isActive = episodeNumber === value;
+                  const isWatched = watchedEpisodes.has(episodeNumber);
                   return (
                     <button
                       key={episodeNumber}
                       onClick={() => handleEpisodeClick(episodeNumber - 1)}
-                      className={`h-10 min-w-10 px-3 py-2 flex items-center justify-center text-sm font-medium rounded-md transition-all duration-200 whitespace-nowrap font-mono
+                      className={`relative h-10 min-w-10 px-3 py-2 flex items-center justify-center text-sm font-medium rounded-md transition-all duration-200 whitespace-nowrap font-mono border
                         ${isActive
-                          ? 'bg-green-500 text-white shadow-lg shadow-green-500/25 dark:bg-green-600'
-                          : 'bg-gray-200 text-gray-700 hover:bg-gray-300 hover:scale-105 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600'
+                          ? 'bg-green-500 text-white border-green-400 shadow-lg shadow-green-500/25 dark:bg-green-600'
+                          : isWatched
+                            ? 'bg-emerald-50 text-emerald-700 border-emerald-200 hover:bg-emerald-100 hover:scale-105 dark:bg-emerald-900/20 dark:text-emerald-300 dark:border-emerald-700/60 dark:hover:bg-emerald-900/30'
+                            : 'bg-gray-200 text-gray-700 border-transparent hover:bg-gray-300 hover:scale-105 dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600'
                         }`.trim()}
+                      title={isWatched && !isActive ? '已观看过' : undefined}
                     >
+                      {isWatched && !isActive && (
+                        <span className='absolute top-1 right-1 h-1.5 w-1.5 rounded-full bg-emerald-500 dark:bg-emerald-400' />
+                      )}
                       {(() => {
                         const title = episodes_titles?.[episodeNumber - 1];
                         if (!title) {
diff --git a/src/components/UserMenu.tsx b/src/components/UserMenu.tsx
index 104694a..c55dbaf 100644
--- a/src/components/UserMenu.tsx
+++ b/src/components/UserMenu.tsx
@@ -542,6 +542,10 @@ export const UserMenu: React.FC = () => {
       const savedDisableAutoLoadDanmaku = localStorage.getItem('disableAutoLoadDanmaku');
       if (savedDisableAutoLoadDanmaku !== null) {
         setDisableAutoLoadDanmaku(savedDisableAutoLoadDanmaku === 'true');
+      } else {
+        const runtimeDefault =
+          (window as any).RUNTIME_CONFIG?.DANMAKU_AUTO_LOAD_DEFAULT !== false;
+        setDisableAutoLoadDanmaku(!runtimeDefault);
       }
 
       const savedDanmakuMaxCount = localStorage.getItem('danmakuMaxCount');
@@ -1339,7 +1343,11 @@ export const UserMenu: React.FC = () => {
     setBufferStrategy('medium');
     setNextEpisodePreCache(true);
     setNextEpisodeDanmakuPreload(true);
-    setDisableAutoLoadDanmaku(false);
+    const defaultDanmakuAutoLoad =
+      (typeof window !== 'undefined' &&
+        (window as any).RUNTIME_CONFIG?.DANMAKU_AUTO_LOAD_DEFAULT !== false) ||
+      false;
+    setDisableAutoLoadDanmaku(!defaultDanmakuAutoLoad);
     setHomeBannerEnabled(true);
     setHomeContinueWatchingEnabled(true);
     setHomeModules(defaultHomeModules);
@@ -1364,7 +1372,10 @@ export const UserMenu: React.FC = () => {
       localStorage.setItem('bufferStrategy', 'medium');
       localStorage.setItem('nextEpisodePreCache', 'true');
       localStorage.setItem('nextEpisodeDanmakuPreload', 'true');
-      localStorage.setItem('disableAutoLoadDanmaku', 'false');
+      localStorage.setItem(
+        'disableAutoLoadDanmaku',
+        String(!defaultDanmakuAutoLoad)
+      );
       localStorage.setItem('danmakuMaxCount', '0');
       localStorage.setItem('danmaku_heatmap_disabled', 'false');
       localStorage.setItem('homeBannerEnabled', 'true');
diff --git a/src/lib/admin.types.ts b/src/lib/admin.types.ts
index 9c20072..04cb37f 100644
--- a/src/lib/admin.types.ts
+++ b/src/lib/admin.types.ts
@@ -20,6 +20,7 @@ export interface AdminConfig {
     DanmakuSourceType?: 'builtin' | 'custom';
     DanmakuApiBase: string;
     DanmakuApiToken: string;
+    DanmakuAutoLoadDefault?: boolean; // 是否默认自动加载弹幕（用户可在本地覆盖）
     // TMDB配置
     TMDBApiKey?: string;
     TMDBProxy?: string;
diff --git a/src/lib/config.ts b/src/lib/config.ts
index 042c89c..8a78bd4 100644
--- a/src/lib/config.ts
+++ b/src/lib/config.ts
@@ -255,6 +255,7 @@ async function getInitConfig(configFile: string, subConfig: {
         process.env.DANMAKU_API_BASE ||
         (hasCustomDanmakuEnv ? 'http://localhost:9321' : BUILTIN_DANMAKU_API_BASE),
       DanmakuApiToken: process.env.DANMAKU_API_TOKEN || '87654321',
+      DanmakuAutoLoadDefault: true,
       // TMDB配置
       TMDBApiKey: process.env.TMDB_API_KEY || '',
       TMDBProxy: process.env.TMDB_PROXY || '',
@@ -450,6 +451,7 @@ export function configSelfCheck(adminConfig: AdminConfig): AdminConfig {
       DanmakuSourceType: 'builtin',
       DanmakuApiBase: BUILTIN_DANMAKU_API_BASE,
       DanmakuApiToken: '87654321',
+      DanmakuAutoLoadDefault: true,
       PansouApiUrl: '',
       PansouUsername: '',
       PansouPassword: '',
@@ -482,6 +484,9 @@ export function configSelfCheck(adminConfig: AdminConfig): AdminConfig {
   if (!adminConfig.SiteConfig.DanmakuApiToken) {
     adminConfig.SiteConfig.DanmakuApiToken = '87654321';
   }
+  if (adminConfig.SiteConfig.DanmakuAutoLoadDefault === undefined) {
+    adminConfig.SiteConfig.DanmakuAutoLoadDefault = true;
+  }
   // 确保评论开关存在
   if (adminConfig.SiteConfig.EnableComments === undefined) {
     adminConfig.SiteConfig.EnableComments = false;
diff --git a/src/lib/db.client.ts b/src/lib/db.client.ts
index 62e4bea..14d2129 100644
--- a/src/lib/db.client.ts
+++ b/src/lib/db.client.ts
@@ -787,9 +787,21 @@ export async function savePlayRecord(
         body: JSON.stringify({ key, record }),
       });
     } catch (err) {
-      await handleDatabaseOperationFailure('playRecords', err);
-      triggerGlobalError('保存播放记录失败');
-      throw err;
+      // 播放记录以用户体验为优先：保留已经写入的本地缓存，避免切集后记忆进度被回滚。
+      console.warn('同步播放记录到数据库失败，保留本地缓存:', err);
+
+      // 后台再尝试补一次，不打断当前播放流程。
+      window.setTimeout(() => {
+        fetchWithAuth('/api/playrecords', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({ key, record }),
+        }).catch((retryErr) => {
+          console.warn('播放记录后台重试失败:', retryErr);
+        });
+      }, 3000);
     }
     return;
   }
@@ -2245,4 +2257,3 @@ export async function saveEpisodeFilterConfig(
   }
 }
 
-