Аудио с сервера Icecast не воспроизводится в Chrome

у меня возникли проблемы с получением статического контента (mp3-файлов), обслуживаемого сервером Icecast, чтобы играть в браузере Google Chrome с HTML5. Причина, по которой мы обслуживаем MP3 через Icecast, - это политика: CPB требует, чтобы они были "потоковыми", а не "загруженными", поскольку мы-Общественное радио. Наши живые аудиопотоки отлично воспроизводятся в Chrome.

если вы поместите URL-адрес для MP3, обслуживаемого моим сервером Icecast 2.4.3, прямо в панель URL-адресов в google Chrome, он не воспроизводится. Сделать то же самое в 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/

кроме того, если вы посмотрите на заголовки ответов, вы увидите "Content-Range:bytes 0-0/0"... может, это что-то значит?

обновление: я тестирую, чтобы узнать, является ли это проблемой CORS (cross origin resource sharing). Я обновил в 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() is a Promise
  return audioElement.play().then(function(x){console.log('yay!')}, function(reason){
      console.log('Error: ' + reason);
  });
}
var playButton = document.querySelector('#play');
playButton.addEventListener('click', startPlayback);

он не изменил конечный результат в Chrome, но в Firefox он не играет сейчас, и он дает предупреждение:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://streaming.kansaspublicradio.org:8001/mp3/First_0713886.mp3. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

как вы думаете, сервер Icecast нуждается в заголовке "Access-Control-Allow-Origin", установленном в "allow" или что-то еще?

вот полный ответ Сервер Icecast:

Request URL:https://streaming.kansaspublicradio.org:8001/mp3/First_0713886.mp3
Request Method:GET
Status Code:206 Partial Content
Remote Address:129.237.213.244:8001
Referrer Policy:no-referrer-when-downgrade

Response Headers
view source
Accept-Ranges:bytes
Cache-Control:no-cache
Content-Length:526408
Content-Range:bytes 0-0/0
Content-Type:audio/mpeg
Date:Tue, 15 Aug 2017 19:34:23 GMT
Expires:Mon, 26 Jul 1997 05:00:00 GMT
Pragma:no-cache
Server:Icecast 2.4.3

Request Headers
view source
Accept:*/*
Accept-Encoding:identity;q=1, *;q=0
Accept-Language:en-US,en;q=0.8,ms;q=0.6
Cache-Control:no-cache
Connection:keep-alive
DNT:1
Host:streaming.kansaspublicradio.org:8001
Origin:https://fiddle.jshell.net
Pragma:no-cache
Range:bytes=0-
Referer:https://fiddle.jshell.net/_display/
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36

обновление 2: мы добавили заголовок CORS Access-Control-Allow-Origin:* к заголовкам ответов сервера icecast, и теперь jsfiddle работает в Firefox-нет CORS header ‘Access-Control-Allow-Origin’ missing предупреждение. По-прежнему не играет в Chrome, хотя : (

Я также протестировал WAV-файлы и файлы M3U, и ни один не будет играть в Chrome. Firefox может воспроизводить wav-файл (с кодом JSfiddle), но нет файла m3u