1. 獲取視頻流

HTML5提供了一個新的API——MediaDevices.getUserMedia()，可以獲取到攝像頭的視頻流。該API支持在移動設備和桌面端使用，可以獲取攝像頭、麥克風等設備的訪問權限。使用MediaDevices.getUserMedia()獲取視頻流的代碼如下：

avigatorediaDevices.getUserMedia({ video: true, audio: true })ction) {ent.querySelector('video');;loadedmetadataction(e) {

video.play();

};

})ction(err) {soleessage);

});

2. 拍攝視頻

vasvasvasvasvas方式進行視頻錄制的代碼如下：

vasentvas');textvastext('2d');ent.querySelector('video');ent.querySelector('#record');

tListenerction() {ks = [];vas();ew);dataavailablection(e) {ks.push(e.data);

};stopction(e) {ewksp4' });

var url = URL.createObjectURL(blob);loadLinkentent('a');loadLink.href = url;loadLinkloadp4';loadLink.click();

recorder.start();tervalction() {textagevasvas.height);

}, 1000 / 24);eoutction() {

recorder.stop();

}, 10000); // 10秒后停止錄制

3. 結語

vas方式和MediaRecorder方式都可以實現(xiàn)視頻錄制，根據(jù)需求選擇合適的方式即可。