iT邦幫忙

0

electron 中錄製影片丟到 nodejs寫入的問題?

  • 分享至 

  • xImage

我在前端做了一個可以錄製視訊畫面的功能

我現在的做法是錄製完畢後
把所有chunks變成blob然後丟給main-process(node.js)
讓node去做一次寫入
但是一次性的寫入對太大影片是不是會產生問題啊?

如何在錄製開始時
將一個個的chunk丟到electron的main-process(node.js)裡面
當錄製完畢時剛好變成一個影片檔案

另外我一次性寫入
後影片無法撥放
這是electron renderer process前端的code:

let chunks = []
mediaRecorder = new MediaRecorder(stream)
mediaRecorder.addEventListener('dataavailable', function (e) {
    chunks.push(e.data) // 取得資料
})
mediaRecorder.addEventListener('stop', function (e) {
    var blob = new Blob(chunks, { 'type': 'video/webm; codecs=vp9' })
    chunks = [];
    let fileName = Date.now();
    let reader = new FileReader()
    reader.onload = function () {
        if (reader.readyState == 2) {
            let fileName = Date().now();
            var buffer = new Buffer(reader.result)
            //丟給nodejs處理寫入
            ipcRenderer.send('save-video', fileName, buffer)
        }
    }
    reader.readAsArrayBuffer(blob)
})

這是electron main process nodejs的code負責寫入檔案

ipcMain.on('save-video', async (event, name, buffer) => {
    let namepath = defaultPATH + name + ".webm"
    //C:\Users\ziv\Pictures\WEBCAM CAPTURE\
    fs.writeFile(namepath, buffer, function (err) {
        if (err) {
            console.error('Failed to save video ' + err);
        } else {
            console.log('Saved video: ' + namepath);
        }
    });
})
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

0
kikulu
iT邦研究生 3 級 ‧ 2020-07-30 16:29:53

看看這個能不能用
https://fireship.io/lessons/electron-screen-recorder-project-tutorial/

google keyword:electron video recorder

這個是一口氣把整個影片寫入到檔案系統
但是我想到的是在錄製時就一邊寫入

kikulu iT邦研究生 3 級 ‧ 2020-07-30 17:26:46 檢舉

去找ffmpeg或video.js
可以處理video stream的試試

我要發表回答

立即登入回答