Ich möchte die Webcam und das Audio des Benutzers aufzeichnen und in einer Datei auf dem Server speichern. Diese Dateien könnten dann anderen Benutzern zur Verfügung gestellt werden.
Ich habe keine Probleme mit der Wiedergabe, aber ich habe Probleme, den Inhalt aufzunehmen.
Ich verstehe, dass die .record()Funktion getUserMedia noch nicht geschrieben wurde - bisher wurde nur ein Vorschlag dafür gemacht.
Ich möchte mithilfe der PeerConnectionAPI eine Peer-Verbindung auf meinem Server herstellen. Ich verstehe, dass dies ein bisschen hackig ist, aber ich denke, es sollte möglich sein, einen Peer auf dem Server zu erstellen und aufzuzeichnen, was der Client-Peer sendet.
Wenn dies möglich ist, sollte ich diese Daten in flv oder einem anderen Videoformat speichern können.
Eigentlich bevorzuge ich die clientseitige Aufnahme von Webcam + Audio, damit der Client Videos erneut aufnehmen kann, wenn ihm der erste Versuch vor dem Hochladen nicht gefallen hat. Dies würde auch Unterbrechungen bei Netzwerkverbindungen ermöglichen. Ich habe einen Code gesehen, mit dem einzelne "Bilder" von der Webcam aufgezeichnet werden können, indem die Daten auf die Leinwand gesendet werden - das ist cool, aber ich brauche auch Audio.
Hier ist der clientseitige Code, den ich bisher habe:
<video autoplay></video>
<script language="javascript" type="text/javascript">
function onVideoFail(e) {
console.log('webcam fail!', e);
};
function hasGetUserMedia() {
// Note: Opera is unprefixed.
return !!(navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia);
}
if (hasGetUserMedia()) {
// Good to go!
} else {
alert('getUserMedia() is not supported in your browser');
}
window.URL = window.URL || window.webkitURL;
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia;
var video = document.querySelector('video');
var streamRecorder;
var webcamstream;
if (navigator.getUserMedia) {
navigator.getUserMedia({audio: true, video: true}, function(stream) {
video.src = window.URL.createObjectURL(stream);
webcamstream = stream;
// streamrecorder = webcamstream.record();
}, onVideoFail);
} else {
alert ('failed');
}
function startRecording() {
streamRecorder = webcamstream.record();
setTimeout(stopRecording, 10000);
}
function stopRecording() {
streamRecorder.getRecordedData(postVideoToServer);
}
function postVideoToServer(videoblob) {
/* var x = new XMLHttpRequest();
x.open('POST', 'uploadMessage');
x.send(videoblob);
*/
var data = {};
data.video = videoblob;
data.metadata = 'test metadata';
data.action = "upload_video";
jQuery.post("http://www.foundthru.co.uk/uploadvideo.php", data, onUploadSuccess);
}
function onUploadSuccess() {
alert ('video uploaded');
}
</script>
<div id="webcamcontrols">
<a class="recordbutton" href="javascript:startRecording();">RECORD</a>
</div>