本文介绍了一种使用JavaScript在浏览器环境中实现视频捕获的方法，并通过不同浏览器的API调用展示了如何将捕获的视频流实时渲染到Canvas上。文章涵盖了获取用户媒体设备权限、处理跨浏览器兼容性等问题。
javascript// put event listeners into place
window.addeventlistener("domcontentloaded", function() {
// grab elements, create settings, etc.
var canvas = document.getelementbyid("canvas"),
context = canvas.getcontext("2d"),
video = document.getelementbyid("video"),
videoobj = { "video": true },
errback = function(error) {
console.log("video capture error: ", error.code);
};
// put video listeners into place
if(navigator.getusermedia) { // standard
navigator.getusermedia(videoobj, function(stream) {
video.src = stream;
video.play();
}, errback);
} else if(navigator.webkitgetusermedia) { // webkit-prefixed
navigator.webkitgetusermedia(videoobj, function(stream){
video.src = window.webkiturl.createobjecturl(stream);
video.play();
}, errback);
}
else if(navigator.mozgetusermedia) { // firefox-prefixed
navigator.mozgetusermedia(videoobj, function(stream){
video.src = window.url.createobjecturl(stream);
video.play();
}, errback);
}
}, false);
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
