update tiktok download

HANDOFF_SUBTITLE_PREVIEW.md

@@ -0,0 +1,119 @@
+# BÀN GIAO: Khớp "xem trước" phụ đề với video burn (hard subtitle)
+
+> Tài liệu context để 1 agent khác tiếp tục. Đọc hết trước khi sửa. Repo:
+> `website_content` (HF Space Docker, base `python:3.11-slim`). FE React+Vite,
+> BE FastAPI. Team 2 người, đồng nghiệp `dangdev` hay **force-push main** → cẩn thận.
+
+---
+
+## 1. MỤC TIÊU
+Tool "Dịch/đổi giọng video" → "Chèn phụ đề (hard sub)": trình sửa phụ đề kiểu CapCut.
+Yêu cầu của user: **bản XEM TRƯỚC trong editor phải giống HỆT video BURN ra** (font,
+cỡ chữ, vị trí, ngắt dòng, viền/nền). User rất khó tính về điểm này, đã phàn nàn
+nhiều lần "preview khác burn".
+
+## 2. FILE LIÊN QUAN
+- `frontend/src/components/SubtitleEditor.jsx` — toàn bộ editor (preview CSS + overlay
+  ảnh chuẩn + kéo/thả/sửa text + timeline). **Trọng tâm.**
+- `backend/app/services/dubber/subtitle_render.py` — dựng ASS + burn ffmpeg/libass.
+  Hàm chính: `build_ass_str` (1 NGUỒN ASS), `build_ass` (ghi file), `burn`,
+  `render_frame` (render 1 khung = xem trước chuẩn), `_style_line`, `_bg_event`,
+  `_fontsdir_arg`, `probe_size`.
+- `backend/app/api/dub.py` — endpoint: `POST /api/dub/subtitle` (burn job),
+  `/subtitle/preview-frame` (render 1 khung → PNG), `/subtitle/plan`, `/subtitle/import`.
+- `frontend/src/api.js` — `subtitleBurn`, `subtitlePreviewFrame`.
+- `frontend/src/theme.css` — `@font-face` cho 6 font nhúng (dùng cho CSS preview).
+- `backend/app/assets/fonts/` — 6 file .ttf nhúng (Git LFS).
+- `Dockerfile` — cài `fontconfig` + copy font vào `/usr/share/fonts` + `fc-cache`.
+- `.github/workflows/deploy-hf-spaces.yml` — push toàn bộ history sang HF Space.
+
+## 3. KIẾN TRÚC HIỆN TẠI (sau nhiều vòng sửa)
+**Nguyên tắc vàng đã chốt:** KHÔNG dùng bộ vẽ thứ 2 để "bắt chước" libass. Muốn
+preview = burn thì phải render preview bằng CHÍNH ffmpeg/libass của bản burn.
+
+- `build_ass_str(segments, mode, res)` = NGUỒN ASS DUY NHẤT. Cả `burn` (video cuối)
+  lẫn `render_frame` (ảnh xem trước) đều gọi nó → cùng ASS.
+- FE gửi `segPayload()` (mỗi đoạn: start,end,text,style,breaks) — **breaks** đo bằng
+  canvas ở FE (`measureBreaks`) để ngắt dòng khớp. CÙNG payload cho burn và preview.
+- **Xem trước khớp 100%** (toggle `exact`, mặc định BẬT): khi video **TẠM DỪNG** +
+  không gõ/kéo (`idle`), FE gọi `/subtitle/preview-frame` → server ffmpeg render đúng
+  1 khung tại thời điểm `t` → trả PNG → **đè lên video**. Ảnh đó = ĐÚNG bản burn.
+- Lúc **đang phát / đang chờ ảnh / lỗi / gõ / kéo**: hiện lớp **CSS gần đúng** làm nền
+  (không bao giờ để trống chữ). Ảnh chuẩn về thì đè lên (ẩn CSS qua `showExact`).
+- `render_frame`: `-ss {t} -copyts -i video` (seek đầu vào, nhanh ~0.2s) + subtitles
+  filter + `-update 1` ra PNG. Đã verify pixel trùng KHÍT cách seek đầu ra, nhanh gấp 3.
+
+## 4. LỊCH SỬ ĐÃ LÀM (commit mới → cũ)
+- `1b53507` fix: **không bao giờ trống chữ** — chỉ ẩn CSS khi ảnh chuẩn ĐÃ hiện
+  (`showExact = idle && previewImg`); còn lại luôn hiện CSS nền. `<img onError>` lùi CSS.
+- `6547b89` fix: lúc phát ẩn phụ đề gần-đúng (sau đó `1b53507` chỉnh lại thành luôn
+  hiện CSS nền); `render_frame` seek đầu vào +copyts nhanh 3x; debounce 200ms.
+- `4f9859d` fix: **BỎ libass-wasm**, chuyển sang render khung ở server (xem mục 5).
+- `d908e31` feat: (ĐÃ HỦY) thử libass-wasm/SubtitlesOctopus real-time — thất bại.
+- `d4a04dd` fix: **nhúng 6 font mã nguồn mở** (Be Vietnam Pro, Roboto, Open Sans,
+  Montserrat, Arimo≈Arial, Tinos≈Times) vào `assets/fonts`, đặt **Git LFS**; ASS
+  `Bold=0` (font đã đậm sẵn); Dockerfile cài fontconfig + font hệ thống. `@font-face`
+  cho CSS preview. Sửa lỗi gốc: server Linux thiếu font Microsoft → libass fallback
+  DejaVu → lệch. (Đã verify trên Debian WSL: libass chọn đúng font nhúng, 0 fallback.)
+
+## 5. NGHIÊN CỨU QUAN TRỌNG (đừng lặp lại sai lầm)
+- **CSS ≠ libass:** trình duyệt vẽ chữ theo luật riêng (wrap, viền, cỡ, nền) khác
+  libass → CSS preview KHÔNG BAO GIỜ giống hệt burn. Đừng cố tinh chỉnh CSS cho khớp.
+- **libass-wasm ≠ ffmpeg libass:** cả 2 đều libass NHƯNG **khác phiên bản build** →
+  render khác nhau. libass còn có bug [#460](https://github.com/libass/libass/issues/460):
+  logic đổi/fallback font **làm RỚT vài chữ/glyph** (phụ thuộc phiên bản). Đây là lý do
+  đã BỎ libass-wasm. → Kết luận: chỉ có server ffmpeg mới đảm bảo giống hệt.
+- **Lỗi hình học letterbox (đã sửa):** trước đây overlay tính theo khung thẻ `<video>`
+  (width 100% + maxHeight 460 + objectFit contain) → có viền đen 2 bên → overlay lệch
+  ngang + hộp sai + wrap khác. ĐÃ SỬA: `fit` = tính cỡ hiển thị = nội dung video THẬT
+  (bỏ letterbox), `wrapRef` đúng cỡ đó, overlay ánh xạ đúng toạ độ. (Xác nhận trong
+  trình duyệt: video clientW/H = đúng nội dung.)
+- **Deploy HF:** workflow push TOÀN BỘ history sang HF. HF `pre-receive hook` TỪ CHỐI
+  binary thô (báo "contains binary files / dùng xet") nhưng CHẤP NHẬN binary dạng LFS.
+  → Mọi file nhị phân (.ttf, .wasm...) PHẢI Git LFS. `.gitattributes` đã có `*.ttf *.otf`.
+- **Windows dev bẫy:** render thử trên Windows KHỚP vì có sẵn font MS → phải test môi
+  trường GIỐNG SERVER. Cách test Linux libass thật (máy này không có Docker):
+  `wsl --install -d Debian` rồi `apt install ffmpeg fontconfig`, render bằng ffmpeg
+  `-loglevel verbose`, tìm dòng `fontselect: (Family,...) -> /path.ttf` để biết libass
+  nạp đúng font (không fallback DejaVu / không "Glyph not found").
+- **render_frame nhanh:** `-ss {t}` TRƯỚC `-i` (seek keyframe, nhanh) + `-copyts`
+  (giữ PTS đúng để phụ đề hiện đúng thời điểm). Đã đo: 0.22s vs 0.62s (seek đầu ra),
+  ảnh y hệt.
+
+## 6. BUG ĐANG MỞ (cần agent tiếp theo xử lý)
+### 6.1. Cỡ chữ preview (CSS) TO hơn burn — user vừa báo
+- Triệu chứng: bản preview lúc toggle TẮT (CSS) chữ to; video burn chữ nhỏ hơn.
+- **Cần verify trước:** bật toggle "Xem trước khớp 100%" + DỪNG → ảnh chuẩn (server)
+  có cỡ chữ ĐÚNG bằng burn không? Nếu ĐÚNG → đây chỉ là CSS gần đúng vẽ to hơn libass,
+  không phải bug burn; chỉ cần user dùng bản chuẩn. Nếu ảnh chuẩn CŨNG khác burn → bug thật.
+- Preview CSS: `px = st.fontSize * scale()`, `scale = video.clientHeight / videoHeight`
+  (SubtitleEditor.jsx ~L120, L276). Burn: ASS `Fontsize = st.fontSize` tại
+  `PlayResY = probe_size(video)[1]` (subtitle_render.py `_style_line`, `build_ass_str`).
+  Về lý thuyết cùng tỉ lệ `fontSize/videoHeight`. Giả thuyết chênh: (a) CSS font-size
+  (em box) vs libass Fontsize khác metric ~10-20%; (b) `scale()` đọc clientHeight sai
+  thời điểm; (c) 2 ảnh user gửi là 2 ĐOẠN khác nhau nên không so trực tiếp được.
+- **Đề xuất hướng:** nếu muốn CSS preview (lúc phát/kéo) gần cỡ burn hơn, đo hệ số hiệu
+  chỉnh CSS↔libass 1 lần rồi nhân vào `px`. Nhưng ưu tiên: để user xem bằng bản CHUẨN
+  (ảnh server) — đó mới là chân lý.
+
+### 6.2. "Mất chữ" (1 từ không hiện) — cần xác nhận lại
+- Trước đây user thấy mất 1 từ. Rất có thể do libass-wasm cũ (bug #460) → **đã bỏ
+  libass-wasm** nên có thể HẾT. Cần user xác nhận trên ảnh chuẩn (server ffmpeg).
+- Nếu ảnh chuẩn (server) VẪN mất chữ → là bug dựng ASS thật (ảnh hưởng cả burn). Khi
+  đó cần **text chính xác của đoạn** để tái hiện; soi `build_ass_str`/`_esc`/`joinw`/
+  `words_for`/`breaks` xem chữ bị nuốt ở đâu.
+
+## 7. CÁCH TEST / CHỖ DỄ SAI
+- Chạy BE local: env conda `tnt` (`D:\miniconda3\envs\tnt\python.exe`); ffmpeg ở
+  `D:\Tuyen\outsource\video_cook\ffmpeg-8.1.1-essentials_build\bin`. Build FE: `npx vite build`.
+- Editor cần 1 session dub thật (video + srt) → khó e2e ngoài app. Nhưng có thể test
+  riêng `build_ass_str`/`render_frame` bằng python + ffmpeg (xem cách trong git history
+  của các commit trên, hoặc tự dựng video lavfi).
+- **Dòng trạng thái dưới nút play** (mới thêm) cho biết: ✅ đang hiện ảnh chuẩn /
+  ⏳ đang dựng / ⚠ lỗi server / ▶ đang phát. Dùng để chẩn đoán nhanh khi user báo lỗi.
+- KHÔNG test kết luận trên Windows (có sẵn font MS che lỗi). Dùng WSL Debian.
+
+## 8. TRẠNG THÁI
+- Đã push tới `1b53507` trên `origin/main`. Deploy HF tự chạy khi push.
+- Preview khớp burn (khi bật toggle + dừng) về mặt kiến trúc là ĐÚNG (cùng ffmpeg/
+  ASS/font). Việc còn lại chủ yếu là XÁC NHẬN với user trên bản chuẩn + xử 2 bug mục 6.

backend/app/services/downloader/ydl.py

@@ -38,15 +38,35 @@ def clean_error(s) -> str:
     s = s.replace("ERROR:", "").replace("\n", " ").strip()
     return (s[:240] + "…") if len(s) > 240 else s
 
+def _resolve_tiktok_url(url: str) -> str:
+    """Follow redirect cho link rút gọn TikTok (vt.tiktok.com / vm.tiktok.com / share ads link).
 
-def normalize_url(url: str) -> str:
-    """Chuẩn hóa một số dạng link để yt-dlp tải được.
-
-    - Douyin 'jingxuan?modal_id=ID' / '?modal_id=ID' -> '/video/ID'
-    - Bỏ các tham số rác phía sau cho douyin video.
+    Link quảng cáo (Spark Ads) hầu hết ở dạng rút gọn -> không có sẵn '/video/<id>/'
+    nên các bước tách ID phía sau sẽ fail nếu không resolve ra link thật trước.
     """
     u = (url or "").strip()
+    if not re.search(r"(vt|vm)\.tiktok\.com/", u):
+        return u
+    try:
+        import requests  # type: ignore
+        r = requests.head(u, allow_redirects=True, timeout=15,
+                          headers={"User-Agent": _UA_MOBILE})
+        final = r.url or u
+        # Một số server chặn HEAD -> thử GET nếu HEAD không redirect được.
+        if final == u:
+            r = requests.get(u, allow_redirects=True, timeout=15,
+                             headers={"User-Agent": _UA_MOBILE}, stream=True)
+            final = r.url or u
+            r.close()
+        return final
+    except Exception:
+        return u  # resolve fail -> trả lại url gốc, để bước sau tự lo
+
+def normalize_url(url: str) -> str:
+    u = (url or "").strip()
+    u = _resolve_tiktok_url(u)          # <-- MỚI: giải link rút gọn tiktok ads trước
     m = re.search(r"douyin\.com/.*?[?&]modal_id=(\d+)", u)
+
     if m:
         return f"https://www.douyin.com/video/{m.group(1)}"
     m = re.search(r"douyin\.com/video/(\d+)", u)
@@ -179,7 +199,7 @@ def _build_opts(out_dir: str, cookies_file: str | None = None,
     # TikTok/Douyin nay BẮT BUỘC giả lập trình duyệt (impersonation) mới qua được
     # JS challenge + lấy luồng video; thiếu -> chỉ bóc được metadata/audio, coi như
     # "không phải video". Cần curl_cffi (trong requirements); không có -> bỏ qua êm.
-    if source in ("tiktok", "douyin"):
+    if source in ("tiktok", "tiktok_photo", "douyin"):
         try:
             from yt_dlp.networking.impersonate import ImpersonateTarget
             opts["impersonate"] = ImpersonateTarget.from_str("chrome")
@@ -256,9 +276,9 @@ def _attempt(url: str, out_dir: str, opts: dict) -> DownloadResult:
         )
 
 
-_UA_MOBILE = ("Mozilla/5.0 (iPhone; CPU iPhone OS 16_0 like Mac OS X) "
-              "AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 "
-              "Mobile/15E148 Safari/604.1")
+# _UA_MOBILE = ("Mozilla/5.0 (iPhone; CPU iPhone OS 16_0 like Mac OS X) "
+#               "AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 "
+#               "Mobile/15E148 Safari/604.1")
 
 
 def _douyin_direct(url: str, out_dir: str) -> DownloadResult:
@@ -452,7 +472,9 @@ def _tiktok_via_tikwm(url: str, out_dir: str) -> DownloadResult:
         raise RuntimeError(f"tikwm báo lỗi: {j.get('msg')}")
     d = j.get("data") or {}
     title = (d.get("title") or "").strip()
-    m = re.search(r"/(?:video|photo)/(\d+)", url) or re.search(r"(\d{6,})", url)
+    m = (re.search(r"/(?:video|photo)/(\d{6,})", url)
+         or re.search(r"item_id=(\d{6,})", url)
+         or re.search(r"(\d{15,})", url))   # aweme id thường rất dài, ưu tiên số dài nhất
     vid_id = str(d.get("id") or (m.group(1) if m else "tiktok"))
     safe = re.sub(r'[\\/:*?"<>|\n\r\t]+', "_", title)[:60].strip() or vid_id
 
@@ -556,14 +578,22 @@ def download_one(url: str, out_dir: str, cookies_file: str | None = None) -> Dow
             except Exception as e2:
                 return DownloadResult(url=url, ok=False,
                                       error=clean_error(f"{source}: {e2}"))
-        # TikTok: yt-dlp hay chỉ bóc audio -> dự phòng qua tikwm (giống SnapTik):
-        # lấy video no-watermark, hoặc ghép slideshow ảnh+nhạc thành mp4.
-        if source == "tiktok":
+        # TikTok (video thường lẫn ảnh/slideshow lẫn ads): yt-dlp hay chỉ bóc audio
+        # hoặc fail thẳng với nội dung ads -> dự phòng qua tikwm (giống SnapTik).
+        if source in ("tiktok", "tiktok_photo"):
             try:
                 return _tiktok_via_tikwm(url, out_dir)
             except Exception as e_tk:
-                return DownloadResult(url=url, ok=False,
-                                      error=clean_error(f"{first_err} | tikwm: {e_tk}"))
+                msg = f"{first_err} | tikwm: {e_tk}"
+                # Ads nhắm mục tiêu (targeted ads) đôi khi chỉ hiện trong app cho
+                # đúng tài khoản được target -> KHÔNG server nào (kể cả tikwm) có
+                # quyền truy cập nội dung này qua API công khai. Báo rõ để khỏi
+                # nhầm tưởng là bug.
+                if "báo lỗi" in str(e_tk) or "không trả link" in str(e_tk):
+                    msg += (" | Có thể đây là video quảng cáo (Spark Ads) chỉ hiển "
+                           "thị trong app cho tài khoản được nhắm mục tiêu -> "
+                           "không tải được qua API công khai.")
+                return DownloadResult(url=url, ok=False, error=clean_error(msg))
         # YouTube bị chặn (IP datacenter) -> lưới an toàn: thử Invidious/Piped.
         if source == "youtube":
             try: