如何解决浏览器中的JavaScript视频:如何通过修改此示例代码来加载mp4视频?
我找到了用于加载用户网络摄像头(有效)的示例代码,但我想对其进行修改以在项目文件夹中运行“ myvideo.mp4”。这是现有的代码:
async function setupVideo2() {
if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
throw new Error(
'browser API navigator.mediaDevices.getUserMedia not available');
}
const video2 = document.getElementById('video2');
video2.width = videoWidth2;
video2.height = videoHeight2;
const stream = await navigator.mediaDevices.getUserMedia({
'audio': false,'video': {
facingMode: 'user',width: videoWidth2,height: videoHeight2,},});
video2.srcObject = stream;
return new Promise((resolve) => {
video2.onloadedMetadata = () => {
resolve(video2);
};
});
}
我已经在其他地方调用此代码,并且可以正常工作并返回用户的网络摄像头。所以我认为修改此设置应该可以使用任意视频源,例如我的项目文件夹中有一个MP4文件。
解决方法
“ ...我能做
video2.srcObject = './video_example.mp4';
吗?
我收到TypeError:无法在'srcObject'
上设置'HTMLMediaElement'
属性:提供的值不是类型'MediaStream'
。”
否,您必须使用.src
来设置文件路径,而不要使用srcObjecct
。
function setupVideo2()
{
const video2 = document.getElementById('video2');
video2.width = videoWidth2;
video2.height = videoHeight2;
video2.src = "https://www.w3schools.com/tags/movie.mp4"; //# testable video link
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。