我无法获取由Icecast服务器提供的静态内容(mp3文件)以及使用HTML5在Google Chrome浏览器中播放.我们通过Icecast服务mp3的原因是政策:CPB要求它们"流式传输"而不是"下载",因为我们是公共广播.我们的现场音频流在Chrome中播放得很好.
如果您将我的Icecast 2.4.3服务器提供的MP3的URL直接放入谷歌浏览器的网址栏中,则无法播放.在Firefox,IE,Safari等中做同样的事情.它播放!试试吧:
https://streaming.kansaspublicradio.org:8001/mp3/First_0713886.mp3
(我使用的临时解决方案是Flash,但Chrome的最新更新(v60.0)默认情况下阻止Flash,"始终允许此网站"选项似乎不起作用,并且显示Flash的小图标被阻止的更加离散.请在此处尝试:http://kansaspublicradio.org/kpr-news/midwest-farmers-hope-boost-online-grocery-shopping)
我最好猜测为什么会发生这种情况是因为它与此有关:https://developers.google.com/web/updates/2016/03/play-returns-promise?hl = en
因此,我尝试重现他们的代码示例,其中他们使用HTML5 Media Capture来播放音频,而无需用户交互.但是有了这个音频的URL,它就无法播放并抛出这个错误:Uncaught (in promise) DOMException: The element has no supported sources.尝试一下:https://jsfiddle.net/wo94xohr/2/它只能在Chrome中失败而不是Firefox或其他.
我再次尝试但没有HTML5 Media Capture的东西.仍然没有骰子.试试吧:https://jsfiddle.net/yrhets74/
此外,如果你看一下响应标题,你会看到"内容范围:字节0-0/0"......这是否意味着什么?
更新:我正在测试这是否是CORS(跨源资源共享)问题.我已经将jsfiddle更新为:
var audioElement = document.querySelector('#music');
audioElement.crossOrigin = "anonymous"; // CORS access restriction. Worth a shot but no dice
audioElement.type = "audio/mpeg"; // just in case? idk
audioElement.src = "https://streaming.kansaspublicradio.org:8001/mp3/First_0713886.mp3";
function startPlayback() {
// .play() …Run Code Online (Sandbox Code Playgroud)