Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/video/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用getUserMedia启动视频流时触发的事件_Javascript_Video_Html5 Video_Getusermedia_Mediadevices - Fatal编程技术网

Javascript 使用getUserMedia启动视频流时触发的事件

Javascript 使用getUserMedia启动视频流时触发的事件,javascript,video,html5-video,getusermedia,mediadevices,Javascript,Video,Html5 Video,Getusermedia,Mediadevices,我正在使用ZXing JS条形码扫描仪库和视频流输入(网络摄像头或手机摄像头),如下代码所述 一般来说,当视频流刚刚启动时,如何向添加事件侦听器以执行操作?(使用视频流API的视频,从ZXing的decodeFromInputVideoDevice开始) const codereder=new ZXing.BrowserQRCodeReader(); 代码阅读器 .decodeFromInputVideoDevice(未定义,'video')//使用默认输入 .then(result=>con

我正在使用ZXing JS条形码扫描仪库和视频流输入(网络摄像头或手机摄像头),如下代码所述

一般来说,当视频流刚刚启动时,如何向
添加事件侦听器以执行操作?
(使用视频流API的视频,从ZXing的
decodeFromInputVideoDevice开始)

const codereder=new ZXing.BrowserQRCodeReader();
代码阅读器
.decodeFromInputVideoDevice(未定义,'video')//使用默认输入
.then(result=>console.log(result.text))//当找到/识别条形码时会发生这种情况
.catch(err=>console.error(err))

有几种方法可以使用事件侦听器检测视频是否正在播放或是否可以播放:

let video = document.querySelector('video');

// Video has been started/unpaused
video.addEventListener('play', function() {
    ...
})

// Video has resumed play/started/unpaused/finished buffering/finished seeking, etc
video.addEventListener('playing', function() {
    ...
})

// Video can start playing (but might not be playing)
video.addEventListener('canplay', function() {
    ...
})

// Video can be played without buffering (but might not be playing)
video.addEventListener('canplaythrough', function() {
    ...
})
最类似于
视频刚刚开始
的可能是
播放
。但是,根据您希望如何执行函数,上述方法之一应该适合您的需要

有关视频活动的更多信息:

例子
//获取视频
var video=document.querySelector('video');
//添加事件侦听器以监视事件
video.addEventListener('playing',()=>{
console.log('视频正在播放!')
});
//添加流
navigator.mediaDevices.getUserMedia({
视频:真的
})
.then(函数(流){
var videoTracks=stream.getVideoTracks();
stream.onremovetrack=函数(){
console.log(“流结束”);
};
window.stream=流;
video.srcObject=流;
})
.catch(函数(错误){
console.log(错误);
});

我猜播放视频时流“开始”了?如果是,您是否尝试过
video.addEventListener('playing',function(){})
listener@奥利弗,我不是在“播放”视频,我是在使用视频流捕获(从网络摄像头或智能手机摄像头)。这是否适用于这里?我不是在“播放”视频(例如MP4视频),而是在使用实时视频流捕获(从网络摄像头或智能手机摄像头)。
playing
是否适用于这种情况?查看
getUserMedia
的API,它接受要加载的
loadedmetadata
事件,并使用
play()
回调开始流,这两个都是html5视频API的标准,因此它也应该接受其他标准API事件作为响应(即
播放
播放
)如果API不一样,请查看最新的编辑@basjher是一个JSFIDLE,它似乎不起作用:(两个事件似乎都没有被触发)。谢谢,它起作用了!(赏金只能在24小时后颁发,所以我稍后再颁发)