Как я могу воспроизвести поток shoutcast / icecast с использованием HTML5? - PullRequest
Новая
       91

Как я могу воспроизвести поток shoutcast / icecast с использованием HTML5?

25 голосов
/ 30 апреля 2010

Можно ли воспроизводить поток shoutcast / icecast с использованием HTML5?

Если так, как мне это реализовать?

Ответы [ 7 ]

47 голосов
/ 06 июля 2010

Добавьте точку с запятой в конце запроса http. Это протокол, установленный shoutcast для отмены обнаружения в браузере. Как это: 

<audio controls src="http://shoutcast.internet-radio.org.uk:10272/;"></audio>
18 голосов
/ 30 апреля 2010

Существует большая проблема с SHOUTcast, которая, я подозреваю, ответственна за то, что она не работает даже в Chrome, который должен поддерживать MP3.

SHOUTcast может обслуживать три различных типа ответа:

  • протокол потоковой передачи звукового ответа по протоколу ICY. Он решает сделать это, если у игрока, получающего доступ к потоку, есть заголовок icy-metadata: 1.

  • потоковый аудио-ответ обычного HTTP без дополнительных метаданных для медиаплееров без поддержки ICY.

  • «SHOUTcast D.N.A.S. Статус »и другие страницы в веб-интерфейсе.

Как он решает, обслуживать ли веб-страницу вместо аудиопотока? Он догадывается, используете ли вы веб-браузер. Посмотрев, начинается ли заголовок User-Agent с Mozilla/.... Потому что все браузеры Mozilla, верно? Боже, SHOUTcast.

Поэтому, когда Chrome пытается извлечь аудиопоток для воспроизведения, SHOUTcast считает, что это веб-браузер (ну ... это так), и отказывается предоставить ему аудиопоток для добавления в аудиотег. Вместо этого он получает веб-страницу администратора.

(я полагаю, что Safari пропускает заголовок icy-metadata, чтобы избежать проблемы, имея особую поддержку SHOUTcast. В данный момент я не могу проверить это, так как Safari не будет воспроизводить аудио или видео. Возможно, он хочет, чтобы я установите QuickTime для этого. Может быть, он может пойти напичкаться.)

Так что вам, вероятно, понадобится добавить Flash аудио проигрыватель в качестве запасного варианта.

4 голосов
/ 19 мая 2013 
<audio src="http://85.25.108.20:8090/;" controls autoplay></audio>

Это должно работать нормально, но убедитесь, что /; есть после URL потока и порта. Если вам не требуется автозапуск, удалите тег "autoplay" .

3 голосов
/ 30 апреля 2010
3 голосов
/ 30 апреля 2010

Да. Но его работа только в Safari 

    <!DOCTYPE html>
<audio controls src="http://shoutcast.internet-radio.org.uk:10272/"></audio>

Причина Opera и Firefox не поддерживают несвободные кодеки

0 голосов
/ 25 октября 2018

Я использую Icecast с Easystream для потоковой передачи на Mac и ПК. Скрипт Настраивает аудиоплеер под названием MP3 Sticky Player. швейцарские франки С файлами поддержки документации проигрыватель просто загружается, как показано ниже в обоих случаях.

PC 

<ul id="playlist" style="display:none;">
        <li data-path="http://99.250.117.109:8000/stream" data-thumbpath="thumbnail of whatever" data-downloadable="no" data-duration="00:00">
    </li>
</ul>

MAC 

<audio style="width: 100%" controls="controls" autoplay="autoplay" src="http://99.250.117.109:8000/stream">
            Your browser does not support the <code>audio</code> element.
</audio>

Поскольку мы удалили изображения из любых метаданных mp3, мы используем загрузчик изображений, который захватывает Icy-MetaData (для справки, для корректной работы вам понадобится как минимум PHP 5.4) и соответствует каталогу обложек для каждой песни проигрывателя, которая транслируется.

0 голосов
/ 13 мая 2017

При проблемах с перенаправлением с тегом <audio> в браузерах попробуйте добавить "/ stream" в конце URL потока для предотвращения перенаправления.

пример:

не работает: http://live -radio01.xxxxxx.com / 2TJW / mp3

рабочий: http://live -radio01.xxxxxx.com / 2TJW / mp3 / поток

...