怎麼用
- 決定要不要錄聲音:勾「系統/分頁聲音」會在選畫面時提供分享音訊的選項;勾「麥克風」則是同時錄你說話的聲音。兩個都不勾就是無聲影片。
- 按「開始錄影」,瀏覽器會跳出選擇視窗,選「整個螢幕」「視窗」或「分頁」。要錄聲音的話,請在這個視窗裡勾選「分享系統音訊」或「分享分頁音訊」。
- 選好之後會倒數 3 秒,倒數時按「取消」可以放棄。開始錄後,計時與已錄的檔案大小會即時更新,需要時按「暫停」「繼續」。
- 按「停止」(或用瀏覽器的「停止分享」)結束,頁面會顯示預覽。確認沒問題再按「下載」;不滿意就按「刪除錄影」重錄。
各瀏覽器與裝置的支援情形
網頁錄螢幕靠瀏覽器的 getDisplayMedia 功能,能錄什麼、有沒有聲音,每個瀏覽器不一樣。下表整理自 MDN 的相容性資料(來源見下方),實際行為依瀏覽器版本與系統設定而定。
| 環境 | 能不能錄螢幕 | 能不能錄聲音 |
|---|---|---|
| 電腦版 Chrome、Edge(Windows) | 可以 | 選「整個螢幕」可勾選分享系統音訊;選「分頁」可分享該分頁的聲音 |
| 電腦版 Chrome、Edge(Mac) | 可以(系統要先允許瀏覽器螢幕錄製) | 只有「分頁」的聲音;整個螢幕與視窗沒有電腦聲音 |
| 電腦版 Firefox | 可以 | MDN 標示不支援錄聲音;可勾「麥克風」錄自己的聲音 |
| 電腦版 Safari | 可以 | MDN 標示不支援錄聲音;可勾「麥克風」錄自己的聲音 |
| iPhone/iPad Safari | 不行 | — |
| Android 的 Chrome、Firefox、三星瀏覽器 | 不行 | — |
Mac 要先到「系統設定」→「隱私權與安全性」→「螢幕與系統音訊錄製」(舊版 macOS 叫「螢幕錄製」),把你用的瀏覽器打開,再完全結束瀏覽器重新開啟,否則可能只錄到桌面背景,或直接失敗。
輸出格式怎麼決定
錄影由瀏覽器的 MediaRecorder 直接編碼。工具會用 MediaRecorder.isTypeSupported 逐一詢問瀏覽器:如果支援 MP4(H.264),就錄成 MP4;不支援就用 WebM。哪一種都是瀏覽器原生輸出,這個頁面沒有轉檔,也沒有重新壓縮。錄完會顯示瀏覽器回報的實際格式,下載的副檔名也是依實際格式決定,不會把 WebM 改名成 MP4 騙你。
錄製他人內容的著作權與隱私
- 著作權:電影、影集、音樂、串流平台、線上課程、付費內容,通常有著作權與服務條款限制。為個人用途錄下,仍可能違反平台條款,散布、轉載更可能侵權。請只錄你有權使用的內容。
- 隱私與肖像:視訊會議、通話、直播、社群的私訊與限時動態,裡面有別人的臉、聲音與資料。錄之前先告知並取得同意,尤其是公司內部會議與客戶資料。
- 錄到自己的機密:分享整個螢幕時,彈出的通知、瀏覽器分頁標題、密碼管理員、銀行畫面都會被錄進去。要分享給別人前,先自己從頭看過一次。
隱私實測
以下用 Chromium 自動化測試(自動選擇畫面來源、假麥克風),程式與輸出放在專案的 _test/screen-recorder/。
| 測試 | 結果 |
|---|---|
| 開始錄影、倒數、錄製數秒、暫停與繼續、停止、預覽,再按下載,期間攔截頁面所有網路請求 | 開始錄影後到下載完成,頁面沒有送出任何網路請求(0 筆),也沒有任何 POST 或帶資料的請求。測試時把 Google 廣告與統計腳本擋掉了,正式頁面還會有這兩類請求,統計內容只有頁面路徑與按鈕名稱(例如「sr-start」「sr-stop」),不含影片、聲音或畫面內容。預覽用的是瀏覽器記憶體中的 blob: 網址,不是網路請求。測試用 Chromium 的 MP4(H.264)格式輸出,預覽、暫停繼續、取消倒數與刪除錄影都正常 |
常見問題
錄下來的影片會被上傳或存在你們的伺服器嗎?
不會。畫面與聲音只在你的瀏覽器裡處理,錄好的影片是記憶體裡的一個 Blob 物件,沒有上傳,也沒有存進瀏覽器的儲存空間。你按「刪除錄影」、重新整理或關掉頁面,它就消失了,所以要保留的話請在關頁面前先下載。我們用自動化測試實測過:錄影、預覽、下載的整個過程中,攔截頁面所有網路請求,沒有任何請求帶出影片或聲音(結果寫在下方「隱私實測」)。
為什麼我的手機(iPhone、Android)打開這頁不能錄螢幕?
因為手機瀏覽器目前多數不提供網頁錄螢幕的功能。依 MDN 的相容性資料,getDisplayMedia(網頁錄螢幕用的功能)在 iPhone 的 Safari、Android 的 Chrome 與 Firefox 都不支援,Can I use 的資料顯示 Samsung Internet 也不支援。手機要錄螢幕,請用系統內建功能:iPhone 從「控制中心」的螢幕錄製、Android 從快速設定的螢幕錄製(各廠牌名稱略有不同)。這個頁面在手機上會顯示說明,不會讓你按了沒反應。
怎樣才錄得到電腦播放的聲音?Mac 為什麼常常沒聲音?
要看瀏覽器與作業系統。依 MDN 的相容性資料:只有 Chrome(以及同樣是 Chromium 核心的 Edge)能在螢幕錄影時取得聲音;Firefox 與 Safari 目前不提供。Chrome 在 Windows 與 ChromeOS 上,選擇「整個螢幕」時可以勾選「分享系統音訊」錄到整台電腦的聲音;在 Mac 與 Linux 上,只能錄「分頁」的聲音,選整個螢幕或視窗都沒有電腦聲音。所以 Mac 想錄分頁以外的聲音,這個工具做不到,需要另外的虛擬音效裝置或系統的錄製功能。不論哪個平台,選擇畫面的視窗裡都要自己勾選「分享音訊」,沒勾就沒有聲音。選「視窗」時有沒有聲音選項,依瀏覽器版本與系統而異(MDN 記載 Chrome 141 起新增了視窗分享時的音訊選項),沒看到「分享音訊」勾選就代表那一種來源沒有聲音,可改選整個螢幕(Windows)或分頁。
可以同時錄自己的麥克風嗎?
可以,勾選「同時錄我的麥克風」。瀏覽器會再問一次麥克風權限。如果同時有電腦聲音和麥克風,工具會用瀏覽器的 Web Audio 把兩路混成一路錄進去。若你開著喇叭又開麥克風,麥克風可能會收到喇叭的聲音而產生回音,建議戴耳機。麥克風沒開成功時,影片會照錄,只是沒有你的聲音,頁面會寫明。
下載到的是 MP4 還是 WebM?為什麼不能自己選?
工具會用 MediaRecorder.isTypeSupported 問瀏覽器支援哪種格式,優先選 MP4(H.264),不支援才用 WebM,並在錄完後如實顯示瀏覽器回報的格式。錄影是瀏覽器直接輸出,這個工具沒有轉檔,所以格式取決於你的瀏覽器版本。WebM 在 Chrome、Edge、Firefox 都能直接播,但有些手機、剪輯軟體或播放器不認,可以用 VLC 這類通用播放器開啟,或再用影片轉檔工具轉成 MP4。MP4 錄製的支援依瀏覽器版本而定,本站無法保證你的瀏覽器一定能選到。
可以暫停嗎?會不會錄到「已停止分享」的畫面?
可以暫停與繼續,暫停期間不會錄進去,計時也會暫停,繼續後影片是接在暫停前面的。你也可以直接按瀏覽器網頁頂端的「停止分享」,工具會當成你按了停止,並保留錄到的部分。倒數 3 秒期間若你按「取消」或停止分享,就不會開始錄影。
可以錄多久?檔案會不會太大?
本工具沒有設定時間上限,但錄的過程中影片資料都放在瀏覽器的記憶體,錄得越久、畫面越大,占用越多,頁面會顯示目前已錄多少 MB。電腦記憶體不夠時瀏覽器可能變慢或當掉,長時間錄影請先小段測試,並建議分段錄製、每段錄完先下載。實際碼率與檔案大小由瀏覽器決定,本工具無法設定。
錄影的內容有什麼要注意的?
請只錄你有權錄的內容。錄下他人的影片、串流、線上課程、直播、視訊會議,可能涉及著作權、平台使用條款,以及他人的肖像與隱私;視訊會議也請先告知並取得與會者同意。分享畫面時,通知、私訊、密碼、帳號資訊都可能被錄進去,開始前建議先關掉不相干的視窗並開啟勿擾模式。這裡的說明不是法律意見,有疑慮請洽專業人士。
規格與來源
- 畫面擷取:MDN〈MediaDevices.getDisplayMedia()〉:developer.mozilla.org(需 HTTPS 與使用者操作觸發;聲音選項只是對瀏覽器的提示,不保證取得);使用說明:Using the Screen Capture API。
- 各瀏覽器與平台的支援(含「Windows 與 ChromeOS 可錄整個系統聲音,Linux 與 macOS 只能錄分頁聲音」「手機瀏覽器不支援」):MDN 瀏覽器相容性資料庫 mdn/browser-compat-data(MediaDevices.json);另見 Can I use:getDisplayMedia。
- 錄影與格式判斷:MDN〈MediaRecorder〉與〈MediaRecorder.isTypeSupported()〉:developer.mozilla.org;W3C MediaStream Recording:w3.org/TR/mediastream-recording。
- Mac 螢幕錄製權限官方說明:Apple:控制 Mac 上螢幕與系統音訊錄製的存取。
- 全部在瀏覽器內執行;工具本身不載入外部程式庫(全站的統計與廣告腳本除外)。