使用 JS 實現乙個簡單的螢幕錄影機

本文將向您展示如何使用 JS 實現乙個簡單的螢幕錄影機。

建立乙個按鈕。

start recording

var recording_ongoing = false;var recordingtoggle = document.getelementbyid("recording-toggle");按鈕錄製切換addeventlistener("click", function() else })

在編寫函式之前，宣告 3 個全域性變數（在函式外部）。

var blob, mediarecorder = null;var chunks =

async function startrecording(),audio: true} )devicerecorder = new devicerecorder(stream, )

你可以在這裡閱讀更多關於mimetypes的資訊。

Edge 支援 Video Webmmime 型別。 這是檔案副檔名。 webm。您可以通過以下方式檢查您的瀏覽器是否支援 mimetype：

console.log(mediarecorder.istypesupported("video/webm"))console.log(mediarecorder.istypesupported("video/mp4"))console.log(mediarecorder.istypesupported("video/mp4;codecs=**c1"))

devicerecorder.ondata**ailable = (e) => devicerecorder.onstop = ()=> devicerecorder.start(250)

函式 stoprecording（））chunks = 重置資料塊 var datadownloadurl = urlcreateobjecturl(blob);將其帶到使用者的裝置上，讓 = 文件createelement('a') a.href = datadownloadurl; a.download = `$webm` a.click() url.revokeobjecturl(datadownloadurl)}

如果您的螢幕正在共享，瀏覽器會通知您。

作者：張杰，京東保險。

*：京東雲開發者社群 **請註明**。