Android Chrome上的Html视频是黑色

Question

我的html视频只是Chrome 4.2 for android的黑盒子。

这是我的代码：

<video loop autoplay>
        <source src="url-to-image.webm" type="video/webm">
        <source src="url-to-image.mp4" type="video/mp4">
</video>

它适用于：

• Chrome：桌面和iOS
• Firefox：桌面，iOS，Android
• Safari桌面，iOS

它唯一无效的浏览器是chrome for android。

我也试过用javascript播放视频（video.play（））。 如果我长按视频，Chrome会建议“保存视频”。 我正在使用apache来提供文件。

有什么想法吗？可能是什么？

Answer 1

想出来：

Android Chrome不会像ios chrome那样以海报形象的形式显示视频的第一帧。

除非在视频元素上指定，否则Android Chrome不会显示像ios chrome这样的播放按钮

<video controls>
    ...
</video>

我的次优解决方案是通过JS激活控件：

    // Turn on controls on mobile chrome
    var isAndroid = navigator.userAgent.indexOf('Android') >= 0;
    var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);

    if (isAndroid && isChrome) {
        var videos = document.querySelectorAll('video');

        [].forEach.call(videos, function(video) {
            video.controls = true;
        });
    }

不幸的是，Chrome上也没有显示海报图片，所以没有办法让它不是黑盒子。