HTML视频无法播放

bvjxkvbb  于 2022-12-16  发布在  其他
关注(0)|答案(1)|浏览(207)

我正在基于CodePen创建这样一个视频:

export function createVideoFromBinary(src, mimeType = 'video/mp4') {
    let $video = $(`<video autoplay loop/>`);
    let $source = $(`<source type="${mimeType}"/>`);
    let blob = new Blob([src], {type: mimeType});
    let urlCreator = window.URL || window.webkitURL;
    let objUrl = urlCreator.createObjectURL(blob);
    $source.attr('src', objUrl);
    $video.append($source);
    return $video.get(0);
}

我正在使用PreloadJS预加载视频:

this.m_queue.loadFile({id: 'story1.womanOnBeach', src: 'res/img/story1/woman-on-beach.mp4', type: createjs.AbstractLoader.BINARY});

我是这样使用它的:

let womanOnBeachVideo = PreloadedAssets.story1_womanOnBeach.cloneNode(true);
womanOnBeachVideo.autoplay = true;
this.container.appendChild(womanOnBeachVideo);

这个视频的第一帧出现了,但是视频没有播放(我加载的实际视频不是一个静态图像)。

更新

如果我放置controls属性并手动播放它,或者如果我以编程方式单击它(video.click()),视频就会播放。有更好的方法吗?

v7pvogib

v7pvogib1#

现代浏览器限制了自动播放的使用。通常,只有当视频被静音、音量为0或用户采取某些操作启动视频时,视频才会自动播放。
MDN的Autoplay guide更有深度。

相关问题