it-swarm.com.de

Wie kann ich einen Shoutcast/Icecast-Stream mit HTML5 abspielen?

Kann ich einen Shoutcast/Icecast-Stream mit HTML5 abspielen?

Wenn ja, wie sollte ich es implementieren?

25
Cy.

Fügen Sie am Ende der http-Anfrage ein Semikolon hinzu. Es IS das von Shoutcast festgelegte Protokoll, um die Browsererkennung zu überschreiben. So was:

<audio controls src="http://shoutcast.internet-radio.org.uk:10272/;"></audio>
47
Nate Sweet

Es gibt ein großes Problem mit SHOUTcast, das meiner Meinung nach dafür verantwortlich ist, dass es selbst in Chrome nicht funktioniert, das MP3 unterstützen soll.

SHOUTcast kann drei verschiedene Antwortarten bedienen:

  • ein natives SHOUTcast-Protokoll „ICY“ zum Streaming von Audioantworten. Sie entscheidet sich dafür, wenn der Player, der auf den Stream zugreift, einen icy-metadata: 1-Header enthält.

  • eine einfache HTTP-Streaming-Audioantwort ohne zusätzliche Metadaten für Media Player ohne ICY-Unterstützung.

  • der „SHOUTcast D.N.A.S. Status ”-Seite und andere Seiten der Weboberfläche.

Wie entscheidet es, ob anstelle eines Audiostroms eine Webseite bereitgestellt wird? Es wird vermutet, ob Sie einen Webbrowser verwenden. Überprüfen Sie, ob der User-Agent-Header mit Mozilla/... beginnt. Weil alle Webbrowser Mozilla sind, richtig? Meine Güte, SHOUTcast.

Wenn Chrome also versucht, den Audiostream abzuspielen, denkt SHOUTcast, dass es sich um einen Webbrowser handelt (also ...), und weigert sich, ihm den Audiostream zu geben, um ihn in den Audiotag einzufügen. Stattdessen wird die Admin-Webseite abgerufen.

(Ich würde vermuten, dass Safari den icy-metadata-Header weitergibt, um das Problem zu vermeiden, da SHOUTcast speziell unterstützt wird. Ich kann es momentan nicht testen, da Safari weder Audio noch Video abspielen kann. Vielleicht möchte ich, dass QuickTime dafür installiert wird. Vielleicht kann es satt werden.)

Daher müssen Sie wahrscheinlich einen Flash-Audioplayer als Fallback hinzufügen.

18
bobince
<audio src="http://85.25.108.20:8090/;" controls autoplay></audio>

Dies sollte gut funktionieren, aber stellen Sie sicher, dass /; hinter der Stream-URL und dem Port steht. Wenn Sie kein Autoplay benötigen, entfernen Sie das Tag "Autoplay" .

Ja. Aber es funktioniert nur in Safari

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

Ursache Opera und Firefox unterstützten nicht freie Codecs

3
classless
3
Werewolve

Beim Umleiten von Problemen mit <audio> -Tag in Browsern versuchen Sie, am Ende der Stream-URL "/ stream" hinzuzufügen, um die Umleitung zu verhindern.

beispiel:

funktioniert nicht: http://live-radio01.xxxxxx.com/2TJW/mp3

arbeiten: http://live-radio01.xxxxxx.com/2TJW/mp3/stream

0
DanielBLN

Ich verwende Icecast mit Easystream zum Streaming auf Mac und PC. Ein Skript Richtet den Audioplayer MP3 Sticky Player ein. swf Mit den Dokumentationsdateien wird der Player in beiden Fällen wie folgt geladen.

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>

Da wir Bilder aus allen MP3-Metadaten entfernt haben, verwenden wir einen Image Loader, der die Icy-MetaData erfasst (FYI benötigen Sie mindestens PHP 5.4, um ordnungsgemäß ausgeführt zu werden) und ordnet ein Verzeichnis der Titelbilder für jeden Spieler-Song zu das strömt. 

0
MPG