YouTube 即時翻譯字幕擴充功能
結合 Chrome Extension 與 Go WebSocket 後端的雙語字幕系統。無感擷取影片音訊，透過 Deepgram 語音辨識與 Google/DeepL 輪詢備援機制呈現即時字幕。
專案概述
這個專案為一個前後端分離的即時字幕翻譯系統，專為克服觀看 YouTube 外語影片或直播時的語言障礙而生。透過 Chrome 擴充功能的 Web Audio API 攔截音訊，並使用 WebSocket 動態將音訊串流至 Go 後端，隨後交由 Deepgram 進行超低延遲的語音辨識 (STT)，並實作 Google Translate 與 DeepL API 的失效備援 (Failover) 與負載平衡，最後將原文及翻譯雙語字幕動態呈現在影片播放器上。
技術挑戰與解決方案
前端動態音訊擷取與 WebSocket 緩衝串流
為了做到「即時」，必須從 YouTube 的 HTML5 <video> 標籤無損攔截音軌，並且連續不斷地傳送音訊碎塊(Chunks)給後端，這容易產生記憶體洩漏與串流卡頓的問題。
多翻譯 API 輪詢備援機制 (Failover)
免費版本的機器翻譯服務 (如 Google Translate / DeepL) 很容易因為高頻短句的即時請求觸發 Rate Limit，導致翻譯瞬間中斷失效。
動態防閃爍字幕渲染與狀態同步
由於語音辨識結果 (Transcript) 可能隨著句子講述的推進而動態修正(Interim Results)，DOM 的頻繁重繪容易造成字幕閃爍，嚴重影響觀看體驗。
系統架構
前端擴充功能 (Manifest V3) 負責音訊攔截、WebSocket 通訊與懸浮防閃爍字幕渲染；Go 後端負責與前端建立 WebSocket 提供低延遲傳輸，對接 Deepgram 即時處理音軌流，並封裝了多個翻譯 API 以 Round-Robin 輪詢進行即時語言轉換。所有過往翻譯記錄皆透過前端自動儲存為歷史記錄。
學習與心得
實作這個系統讓我徹底理解了影音串流處理與即時系統的架構難點。從解決前端 Web Audio API 攔截 <video> 音軌時的採樣率轉換，到後端調優 WebSocket 串流的穩定性，以及設計一套不依賴單一翻譯服務的失效備援(Failover)機制。親手做出一個能讓直播無延遲掛上雙語字幕的產品，成就感非常巨大。