大佬教程收集整理的这篇文章主要介绍了Html5视频录制和上传？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
到目前为止,我已经使用webrtc getusermedia写了一个小的概念证明.它可以记录视频和播放,但我不知道如何获取文件上传回服务器.
以下是此示例http://jsfiddle.net/3FfUP/的链接
和JavaScript代码：
(function ($) { window.URL = window.URL || window.webkitURL; navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; var video = document.querySELEctor('video'); var onFailSoHard = function(E) { console.log('Reeeejected!',E); }; $('#capture-button').click (function () { console.log ("capture click!"); if (navigator.getUserMedia) { // Not showing vendor prefixes. navigator.getUserMedia({video: true,audio: truE},function(localMediaStream) { var video = document.querySELEctor('video'); video.src = window.URl.createObjectURL(localMediaStream); // Note: onloadedMetadata doesn't fire in Chrome when using it with getUserMedia. // See crbug.com/110938. video.onloadedMetadata = function(E) { // ready to go. Do some stuff. }; },onFailSoHard); } else { video.src = 'somevideo.webm'; // fallBACk. } }); $('#stop-button').click (function (E) { video.pause (); localMediaStream.stop (); }); })(jQuery);
function sendXHR(){ //Envia bien blob,no interpretado var xhr = new XMLhttprequest(); var video=$("#myexporTingvideo"); xhr.open('GET',video.src,truE); xhr.responseType = 'blob'; xhr.onload = function(E) { if (this.status == 200) { // Note: .response instead of .responseText var blob = new Blob([this.response],{type: 'video/webm'}); console.log(blob.size/1024); console.log(blob.typE); form = new FormData(),request = new XMLhttprequest(); form.append("myblob",blob,"Capture.webm"); form.append("myname",$("#name_test").value); request.open("POST","./UploadServlet",truE); request.send(form); } }; xhr.send(); }
以上是大佬教程为你收集整理的Html5视频录制和上传？全部内容，希望文章能够帮你解决Html5视频录制和上传？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。