已更新 记录在用户接受网络摄像头允许时开始，并在用户按下播放键时停止（应该触发记录）
当我请求用户媒体时，用户接受它开始录制，但是以后再播放时，它不能正确再现，并且webm与开始录制和录制结束的开头不匹配。
例如，我与相机通话20秒，它仅返回15 14秒，最后几秒模糊，声音和视频停止播放。
我已经将一些不推荐使用的方法更改为Navigator.getUserMedia（）到navigator.mediaDevices.getUserMedia（），但是仍然找不到发生这种情况的原因。
有人可以帮助我吗？
function listUserMedia(){
if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) {
console.log("enumerateDevices() not supported.");
return;
}
var media = navigator.mediaDevices.enumerateDevices();
media.then(function(devices) {
var useVideo=null;
var useAudio=null;
devices.forEach(function(device) {
//console.log(device.kind + ": " + device.label + " id = " + device.deviceId);
if(device.kind=="audioinput"){
useAudio="true";
}
if(device.kind=="videoinput"){
useVideo="true";
}
});
if(typeof(Storage) !== "undefined") {
sessionStorage.setItem('useAudio', useAudio);
sessionStorage.setItem('useVideo', useVideo);
} else {
console.log("Unable to set SessionStorage");
}
});
media.catch(function(err) {
console.log(err.name + ": " + err.message);
});
if(typeof(Storage) !== "undefined") {
return {"audio":sessionStorage.getItem('useAudio'),"video":sessionStorage.getItem('useVideo')};
} else {
console.log("Unable to get SessionStorage");
}
return null;
}
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
function requestMedia(string){
if(typeof MediaRecorder === 'undefined' || !navigator.getUserMedia){
alert('MediaRecorder/getUserMedia no supported on your browser, kindly use Firefox 36+');
}else{
initiateMedia(listUserMedia());
navigator.getUserMedia(constraint, startRecording, errorCallback);
var media = navigator.mediaDevices.getUserMedia(constraint);
media.then(function(mediaStream){
stream=mediaStream;
var url = window.URL || window.webkitURL;
if(mediaType!=null){
if(mediaType=="video/webm"){
mediactrl.src = url ? url.createObjectURL(stream) : stream;
mediactrl.onloadedmetadata = function(e) {
mediactrl.play();
};
}else{ if (options.noFallback === undefined || options.noFallback === false) {
// Fallback to flash
var source, el, cam;
source = '<!--[if IE]>'+
'<object id="XwebcamXobjectX" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="' + options.width + '" height="' + options.height + '">'+
'<param name="movie" value="' + options.swffile + '" />'+
'<![endif]-->'+
'<!--[if !IE]>-->'+
'<object id="XwebcamXobjectX" type="application/x-shockwave-flash" data="' + options.swffile + '" width="' + options.width + '" height="' + options.height + '">'+
'<!--<![endif]-->'+
'<param name="FlashVars" value="mode=' + options.mode + '&quality=' + options.quality + '" />'+
'<param name="allowScriptAccess" value="always" />'+
'</object>';
el = document.getElementById(options.el);
el.innerHTML = source;
(function register(run) {
cam = document.getElementById('XwebcamXobjectX');
if (cam.capture !== undefined) {
// Simple callback methods are not allowed
options.capture = function (x) {
try {
return cam.capture(x);
} catch (e) {}
};
options.save = function (x) {
try {
return cam.save(x);
} catch (e) {
}
};
options.setCamera = function (x) {
try {
return cam.setCamera(x);
} catch (e) {}
};
options.getCameraList = function () {
try {
return cam.getCameraList();
} catch (e) {}
};
// options.onLoad();
options.context = 'flash';
options.onLoad = successCallback;
} else if (run === 0) {
// options.debug("error", "Flash movie not yet registered!");
errorCallback();
} else {
// Flash interface not ready yet
window.setTimeout(register, 1000 * (4 - run), run - 1);
}
}(3));
}
mediactrl.src = url ? url.createObjectURL(stream) : stream;
mediactrl.onloadedmetadata = function(e) {
mediactrl.play();
}
}
$("#requestmedia").addClass("btndisabled");
$("#videocontrol").removeClass("btndisabled").prop("disabled",false);
$("#mediaerror").html(string).css({"display":"block","color":"#003666"});
}
});
media.catch(function(err){
errorCallback(err);
});
}
}
function startRecording(stream){
if (typeof MediaRecorder.isTypeSupported == 'function'){
if (MediaRecorder.isTypeSupported('video/webm;codecs=vp9')) {
var options = {mimeType: 'video/webm;codecs=vp9'};
} else if (MediaRecorder.isTypeSupported('video/webm;codecs=vp8')) {
var options = {mimeType: 'video/webm;codecs=vp8'};
}
mediaRecorder = new MediaRecorder(stream, options);
}else{
mediaRecorder = new MediaRecorder(stream); //Default codec for browser
}
mediaRecorder = new MediaRecorder(stream);
mediaRecorder.start(10);
mediaRecorder.ondataavailable = function(e){
chunks.push(e.data);
};
mediaRecorder.onerror = function(e){
console.log("Error: "+e)
};
mediaRecorder.onstop = function(){
var blob = new Blob(chunks, {type: mediaType});
chunks = [];
var mediaURL = (window.webkitURL || window.URL).createObjectURL(blob);
sendFileToServer(blob);
//console.log(mediaURL);
};
}
function errorCallback(error){
console.log('navigator.getUserMedia error: ', error);
}
function releaseDevice(){
if(stream && stream.stop){
//stream.stop();
if(mediaType=="video/webm"){
stream.getVideoTracks()[0].stop();
stream.getAudioTracks()[0].stop();
}else{
stream.getAudioTracks()[0].stop();
}
}
stream=null;
}