音频标签在谷歌浏览器中不起作用答案

【问题标题】：audio tag not working in google chrome音频标签在谷歌浏览器中不起作用
【发布时间】：2018-06-29 12:32:04
【问题描述】：

我正在尝试在 google chrome 中流式传输音频文件。该文件托管在 Wildfly 服务器上。下面是示例代码

<html>
<head>
    <title>Audio Demo</title>
    <script type="text/javascript">
        function updateSource(){
            var audio = document.getElementById('wavSource');
            audio.src = 'https://SERVER_URL:8443/FILE_PATH/FILE_NAME.wav';
            var a = document.getElementById('audio');
            a.load();
        }
    </script>
</head>
<body>
    <audio id="audio" controls="controls">
        <source id="wavSource" src="" type="audio/wav"></source>
        Your browser does not support the audio format.
    </audio>
    <button onclick="updateSource();">Item1</button>
</body>

单击按钮时，audio.src 被设置为指定文件。此示例代码在 Firefox 中运行良好，但在 google chrome 中无法运行。如果我将音频文件链接粘贴到选项卡中，则也没有任何反应（无法播放），但我可以保存文件。

在服务器端，在 deployment 目录中创建一个指向音频文件位置的软链接。

我注意到的其他一些事情是，如果我将音频文件捆绑在 EAR 中，那么我可以访问它。现在音频文件是在不同的位置动态生成的，为此我在部署目录中创建了一个软链接。在这种情况下，我无法播放它。

有人可以告诉我我做错了什么吗？

谢谢

【问题讨论】：

如果你在问题中发布你的谷歌浏览器版本会更好
我的谷歌浏览器版本是 67.0.3396.87
你检查过其他版本吗？
不，不是。
然后检查其他版本也

标签： javascript google-chrome html5-audio wildfly-10

【解决方案1】：

你的代码看起来不错。我尝试了不同的音频文件，它可以工作。我认为问题一定是您的音频文件或路径。

【讨论】：

那没有回答！
正如问题中提到的，音频文件在其他浏览器中工作正常
是的，正如我所说的，该代码在 Firefox 中运行良好（虽然尚未在其他浏览器上测试过）。我不明白它有什么问题。这很简单。
@Rumesh 它是 67.0.3396.87
我的也是一样。但它在我的浏览器上可以 100% 正常工作。检查控制台日志是否有任何其他错误。

【解决方案2】：

您的示例代码工作正常，正如我使用 .wav 音频源检查过的那样，如下所示。 检查服务器上您要播放的实际文件，是否可访问、可播放以及是否为实际的 .wav 文件。

如果这在您的 Google Chrome 中不起作用，clear its cache completely，请更新它，重新启动计算机并再次检查。那么它应该可以工作了。

尽管请把你的脚本放在正文标签的底部：

<html>
<head>
    <title>Audio Demo</title>    
</head>
<body>
    <audio id="audio" controls="controls">
        <source id="wavSource" src="" type="audio/wav"></source>
        Your browser does not support the audio format.
    </audio>
    <button onclick="updateSource();">Update Source</button>
    <script type="text/javascript">
        function updateSource(){
            var audio = document.getElementById('wavSource');
            audio.src = 'http://www.wavsource.com/snds_2018-06-03_5106726768923853/people/men/about_time.wav';
            
            var a = document.getElementById('audio');
            a.load();
        }
    </script>
</body>
</html>

来源：WavSource.com

【讨论】：

但是这段代码在 Firefox 中运行良好。所以我认为文件没有任何问题。

【解决方案3】：

我终于解决了这个问题。它与 Wildfly 10.0.0 有关。见this链接。

【讨论】：