Browser Use 新增錄屏與剪輯：智慧體一邊操作，一邊自動做教學影片

browser-harness 是開源專案 browser-use 旗下的瀏覽器測試與控制工具，最近合入的 PR #532 給它加了一整套自動化錄屏和影片製作系統。簡單來說，智慧體在幫你點網頁、填表單的同時，會自動把操作過程記錄下來，並在最後剪輯成一段質感接近 Screen Studio 的教學或演示影片。

它能做什麼

以往讓 AI 跑瀏覽器任務，過程要麼是一堆終端日誌，要麼是連貫性很差的生硬截圖。browser-harness 這套新功能把記錄和剪輯拆成了兩步，交給智慧體全自動完成。

在執行任務時，系統會記錄每一次操作對應的截圖，並生成一份 events.jsonl 事件軌跡。當智慧體完成操作後，呼叫內建的 make-video 技能，它就能自動把這些素材組裝成影片。

剪輯出的成片並不是簡單的快放錄屏。它自帶逼真的 Chrome 視窗外框、柔和的相機鏡頭推拉、合成的平滑游標軌跡，以及底部操作說明和遙測資訊膠囊。如果遇到報錯，畫面還會配合紅色暈影和抖動動效，清晰標出錯誤節點。

更實用的是隱私保護。錄製模組會自動過濾掉 URL 裡的 OAuth 授權碼、Token 和 API 金鑰等敏感引數；影片模板還支援區域馬賽克，在鏡頭縮放甚至畫面切換時，被打碼的敏感區域都會保持畫素化遮擋。

怎麼做到的與怎麼用

這套工具最聰明的地方在於渲染架構：它完全不需要在系統裡安裝龐大的 ffmpeg 依賴。

開發團隊寫了一個獨立的 HTML 合成器（video-template.html），讓瀏覽器自身在 Canvas 上一幀幀繪製視窗、陰影、游標動效和背景漸變。最後直接通過瀏覽器原生的 MediaRecorder API，把畫面匯出為 WebM 影片檔案。整個過程不僅體積輕巧，而且跨平臺表現非常穩定。

在日常使用中，錄製功能可以按需開啟。你只需要對智慧體說「把這個操作錄下來」或者輸入 record 等關鍵詞，它就會呼叫 start_recording() 開始追蹤。如果你想自動記錄所有操作，也可以設定環境變數 BH_RECORD=1。為了防止不同任務混在一起，系統在 180 秒無操作後會自動切分會話；而顯式發起的錄製任務則不受超時限制。

想要生成影片，只需要在任務結束後呼叫互動技能中的 make-video 流程，或者通過 CLI 執行相關影片匯出指令。相關程式碼和技能檔案已經完整合並進 browser-use/browser-harness 主分支，拉取最新程式碼即可直接在本地上手體驗。

為什麼重要

如果你經常需要給團隊寫系統操作手冊、給使用者做產品功能演示，或者在開發基於網頁的 AI 智慧體，這個功能非常值得一試。它把過去需要錄屏軟體加後期剪輯半小時的工作，壓縮成了智慧體執行任務順手匯出的產物。

和市面上依賴複雜剪輯管線或雲端轉碼的方案相比，browser-harness 依靠純前端技術棧把影片渲染閉環在瀏覽器內，既省去了部署負擔，又天然避免了敏感資料外流。它讓 AI 智慧體不僅能默默幹活，還能用體面直觀的方式把活展示出來。