首页 文章

HTML5视频标签音量控制丢失

提问于
浏览 次
3

我网站上的HTML5视频中的音量控制没有出现，请参见屏幕截图：
enter image description here
视频在启动时播放，但没有任何声音 . 视频在VLC和Windows Media Player中也可以很好地播放（有声） .

我已经在Chrome（65.0.3325.162），Firefox（59.0.1）和Android（在三星平板电脑上）进行了测试 . 我的系统的音量适用于其他应用程序和YouTube视频 .

这是（最小）代码（添加高度和海报等附加属性对问题没有影响）：

<!DOCTYPE html>
<html lang='en'>
<body>

    <video controls src='vid1.mp4' width='500'>
    </video>

    <video controls width='500'>
        <source src='vid2.mp4' type='video/mp4' />
    </video>

</body>
</html>

我错过了一些明显的东西吗

[1]: https://i.stack.imgur.com/qAl7D.png

编辑：

当我在 http://techslides.com/demos/sample-videos/small.mp4 上使用示例视频进行测试时，控件出现了 . 它似乎与编码的mp4视频本身有关 .

我现在删除了视频网址 . 我使用VLC对视频进行了重新编码，现在它们正常工作 .

html5 video html5-video volume

2 回答

  • -1

    为什么这些HTML5视频问题会在5年后出现？

    TLDR：您的代码通过短路MP4内容和每秒眼球来绕过视频内容场及其广告点击收入，这是一种报复 . 这是课程的标准 .

    浏览器开发人员已经故意破坏了HTML5 <video> 浏览器嵌入代码，或者无意中围绕解码它们所需的编解码器 . 他们拥有浏览器的源代码，用于解释和解码您的HTML5 MP4文件，以便在浏览器内容区域中显示 . Chrome浏览器开发商在MP4视频市场上占据了一席之地，并且他们的手臂被强大的力量扭曲了 . 因此，浏览器发现解码MP4所需的编解码器很可能来自未经授权的区域，因此我们正在摸索为什么chrome没有显示音量按钮 .

    我的要求必须是HTML5视频在服务器端修复，我不能要求用户摆弄他们的chrome标志或安装纠正错误的插件 . 默认情况下，它必须在最新的Chrome，Safari，Firefox和IE上工作，最好按此顺序 .

    缺少HTML5视频音量按钮的大小写截图：

    视频播放，但音量为零 . 在初始加载期间，也不在播放期间或之后都没有呈现音量按钮 . mp4下载和全屏幕按钮显示并在播放期间正常工作 .

    So very late

    是的，新媒体播放器的chrome标志被禁用：

    enter image description here

    之前的样子，我期待看到的内容：

    enter image description here

    我正在使用的精简代码：

    此代码是从以下内容演变而来的：http://camendesign.com/code/video_for_everybody

    <html><body>
<video width="640" 
       preload="none" 
       height="360" 
       poster="some_content.png" 
       controls="controls">
    <source src="some_content.mp4"
    <source src="__VIDEO__.webm" type="video/webm" />
    <source src="__VIDEO__.ogv" type="video/ogg" /><!--[if gt IE 6]>
    <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D348
    [endif]--><!--[if !IE]><!-->
    <object width="640" height="375" type="video/quicktime" data="__VIDEO__.mp4"
    <param name="src" value="__VIDEO__.mp4" />
    <param name="autoplay" value="false" />
    <param name="showlogo" value="false" />
    <object width="640" height="380" type="application/x-shockwave-flash"
        data="__FLASH__.swf?image=__POSTER__.jpg&amp;file=__VIDEO__.mp4"> 
        <param name="movie" value="__FLASH__.swf?image=__POSTER__.jpg&amp;file=_
        <img src="__POSTER__.jpg" width="640" height="360" />
        <p>
            <strong>No video playback capabilities detected.</strong>
            Why not try to download the file instead?<br>
            <a href="__VIDEO__.mp4">MPEG4</a>
            <a href="__VIDEO__.ogv">Ogg Theora</a>
        </p> 
    </object><!--[if gt IE 6]><!-->
    </object><!--<![endif]-->
</video>
</body></html>

    上面的代码是过去工作的代码，但却被破坏了 .

    最终解决方案对我有用：手动清除MP4视频中的第三方污点 .

    有很多选项可以清理和重新编码MP4视频，其中一些是非免费的 . 一种方法是使用VLC或其他视频播放器或软件打开MP4文件，并在其中打开/保存/重新编码/转换工具，并将其保存为不同的视频编码格式 .

    我能够在Java中编写一个方便的花花公子脚本来迭代每个MP4文件破解打开MP4文件，如果它存在则清除流浪汉污点然后保存并重新部署mp4文件，现在一切都很好 . 然后按计划执行此操作 .

    Other solutions considered, but rejected:

    • 从工具集中删除有问题的HTML5 video embed标记 . 显示带有html5 <img .../> 标签的图像，覆盖播放按钮以指示这是一个视频，当用户点击打开原始MP4视频在浏览器中播放的新标签时：音量按钮显示正确，或最坏情况用户将MP4视频下载到磁盘，然后他们可以通过视频播放器从磁盘中打开它 .

    • 使用其他浏览器或开源浏览器，知道如何做正确的事情 .

    • 尝试切换'new media controls' chrome：//标志，也许在未来的某个时候，Chrome Devs会推动修复，并且它不会因为mp4闻起来有数字版权侵权的证据而感到恐惧 .

    • 向大玩家内容提供商收取先锋和眼球点击收入，只需使用 <a href="">whatever</a> 标记将用户重定向到能够正确显示视频的网站 .

    游戏正在进行中 .

    回复于
  • 2

    您似乎正在使用静音视频 . 因此，音量控制没有显示 .

    看一下这个：

    <video  src='https://www.w3schools.com/tags/mov_bbb.mp4' controls>
</video>
    回复于

相关问题