Il Blog di Fabrizio Mondo

Come utilizzare un player flash per ascoltare una web radio

March 27, 2008 1:16 am

Sodah.de

Cinquantaquattresimo articolo dedicato alle web radio.

Questo articolo è dedicato all’embedding, e non è il primo dedicato all’argomento. Abbiamo già parlato di come inserire dei player audio direttamente all’interno di pagine web. Quello che voglio farvi vedere oggi, è un player flash, realizzato da Sodah, di sodah.de, che permette di ascoltare agevolmente le web radio realizzate con shoutcast (ho provato solo con questo server, con icecast ed altri, proverò a breve).

Intanto dategli un occhiata, potete trovarlo qui: http://nativeradio.sodah.de/

A questo punto vediamo un pò di capire come funziona il player flash. La sua grafica è semplice e spartana, ha una barra informazioni su cui scorrono le info dello streaming (tra cui anche gli avvisi di buffering), un pulsante di stop e uno di play, con anche un pulsante winamp, ed un regolatore di volume…

Molto semplice e funzionale. Ideale a mio modesto parere per l’inserimento in una finestra pop-up. A questo punto, vediamo insieme un pò di codice:


< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>NATIVE FLASH RADIO EXAMPLE</title>

<script type="text/javascript" src="swfobject.js"></script>
</head>

<body>
<div id="flashcontent">
<p>
<strong>Sorry this site have a flash based native radio and needed adobe flash 8+ support. </strong><br />
<a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Download Flash here.</a>
</p>
</div>

<script type="text/javascript">
// < ![CDATA[

var so = new SWFObject("nativeradio.swf", "nativeradio", "149", "105", "8", "#cccccc");
so.addParam("scale", "noscale");
so.addVariable("swfcolor", "b89e7a");
so.addVariable("swfexclusive", "1");
so.addVariable("swfstreamurl", "85.214.80.4:8000");
so.addVariable("swfpause", "1");
so.write("flashcontent");

// ]]>
</script>
</body>
</html>

Questo script sopra descritto permette la creazione del player, richiamando a sua volta altri script, direttamente dal sito di nativeradio. Ci sono delle variabili, che sono swfcolor (a che serva è molto intuibile), swfexclusive, che vincola l’utilizzo della scheda audio, swfstreamurl, che indica da quale url si richiede lo streaming. È la parte principale che dovrete modificare per adattare il player alle vostre esigenze.

Gli altri parametri non sono importanti da settare, almeno per ora.

Per adesso ci fermiamo qua, domandate pure tramite i commenti, l’articolo verrà completato tra breve tempo. Ringrazio Emanuele per avermi consigliato di visitare questo sito e per avermi indicato gli script.

46 Responses to “Come utilizzare un player flash per ascoltare una web radio”

[...] 54° Articolo: Come utilizzare un player Flash per ascoltare una web radio [...]

Martina wrote a comment on March 27, 2008

E bravo fab, anche il 54° è fatto!
Vai così… Sboccia tantissimooo!!!
Kiss ;)))

Emanuele wrote a comment on March 27, 2008

E’ stato un piacere :)

Indaco wrote a comment on March 27, 2008

ciao fabry , che tu sappia legge anche formato aacPlus?…sennò provo.
Grazie

Indaco wrote a comment on March 27, 2008

provato..non funziona. Anche firefox ha qualche problema. Peccato…è veramente carino!

daemonia wrote a comment on March 28, 2008

Se mandi in streaming le canzoni dei Tokio Hotel ricordati di mandarle come si deve… rischieresti di trovarti sotterrato dalle Karampane..

n1ck0 wrote a comment on March 30, 2008

Ciao Fabrizio,
hai scovato subito il mio post nel forum della nostra radio (www.radioradicchio.it).
Sono gia’ due anni che trasmettiamo ed abbiamo gia’ affrontato molti dei problemi che tratti nei tuoi articoli, ma non per questo ci risulteranno meno utili.
Continua cosi’.

Luca

P.S. Il lettore flash e’ gia’ operativo.

luca wrote a comment on March 30, 2008

ciao fabrizio,
non ho ancora letto bene tutti i tuoi articoli, incredibilmente interessanti, ma una domanda subito ce l’ho:posso “inserire” una web radio sul blog di piattaforma blogger?o meglio:riesco a mettere il lettore sul blog? io poi ho un altro problema:sono con fastweb, ma mi pare che la soluzione l’hai già data. ciao e grazie

Fabrizio Mondo wrote a comment on March 31, 2008

@Luca:

Tutto dipende da quali tag html permette di inserire Blogger. Se permette di utilizzare script e tag object, sei a cavallo.

Flippo wrote a comment on April 5, 2008

Ciao! Innanzitutto ho trovato molto utile il tuo articolo, potresti però dirmi se funziona anche con trasmissioni in mp3 tipo http://xx.xx.xx.xx:8100/listen.m3u

Grazie mille

Fabrizio Mondo wrote a comment on April 8, 2008

@Filippo:

Funziona con qualsiasi stream shoutcast, ma devi scrivere solo la redirezione della porta, non il file listen.m3u

viaggiatrice wrote a comment on April 8, 2008

ma guarda un po chi ti trovo nella blogosfera!
ti lascio un il link di un video fatto da palermitani in risposta a queste nuove elezioni..si intitola:
accontentati! magari tra gli attori mi riconoscerai:)

http://it.youtube.com/watch?v=MGzIWd17vN0

Fabrizio Mondo wrote a comment on April 8, 2008

@Viaggiatrice:

Si, ho capito chi sei! E l’ho capito ancora prima di vedere il video :D mi è bastato dare un occhiata alla mail :D

Francesco wrote a comment on April 14, 2008

Ciao Fabry grazie tante delle numerose guide…
ho inserito il player nella pagina html, ho messo l’indirizzo ip:porta ma non riesco a sentire…
è un problema legato a listen2myradio o cosa?
Grazie tante…

p.s. hai mai utilizzato Soma? (www.somasuite.org) sembra interessantissimo, soltanto che ho problemi di compilazione con SomaX

Fabrizio Mondo wrote a comment on April 14, 2008

@Francesco:

Spiega meglio, tu estrai dal servizio listen2myradio l’indirizzo e la porta che ti danno, per poi utilizzarlo col player flash?

Francesco wrote a comment on April 15, 2008

@ Fabry

Esatto…vado su listen2myradio prendo l’indirizzo e la porta e lo inserisco nel pezzo di codice che hai postato…
premo su play, fa connessione in corso e poi mi dice che non è possibile stabilere una connessione con il server…

Fabrizio Mondo wrote a comment on April 15, 2008

@Francesco:

Listen2myradio è un server shoutcast capiente e gratuito, ma con delle limitazioni, tra cui quella di ascoltare la radio tramite la pagina web che viene fornita a corredo da listen2myradio. Il problema potrebbe essere questo, prova con un altro server.

Francesco wrote a comment on April 15, 2008

@ Fabry

me ne potresti suggerire uno gratuito e funzionante decentemente?
Ti ringrazio

VDJ wrote a comment on April 15, 2008

Ciao Fabrizio complimenti per il tuo blog volevo chiederti quale Shoutcast mi consigli di usare , perchè aavevo intenzione di creare una piccola radio per amici e poi se mi davi qualche altra dritta su come usarlo
Grazie, anticipatamente

Fabrizio Mondo wrote a comment on April 15, 2008

@VDJ:

é un commento senza senso

VDJ wrote a comment on April 16, 2008

Volevo dire vado su listen2myradio faccio la Sign Up e poi cosa devo fare ?

Fabrizio Mondo wrote a comment on April 16, 2008

@VDJ: Commenta nell’articolo inerente listen2myradio e non più qui

Denis wrote a comment on April 20, 2008

Ciao,
intanto complimenti per tuo il blog!
Ho iniziato da pochissimo a costruirne uno mio e volevo chiederti due cose su questo player embended:
1- Vorrei che non andasse in play automaticamente all’apertura della pagina, come faccio?
2- E’ possibile inserire più url ed avere un menu’ cliccabile sul player stesso per scegliere tra le varie radio inserite?
grazie mille in anticipo

Fabrizio wrote a comment on May 3, 2008

fabrizio intanto grazie per l’articolo, io vorrei inserire lo streaming della mia radio su un sito web e quando metto questo codice e modifico l’url dello streaming metto http://ipdellaradiosulisten2myradio:porta , ma non mi funziona, cosa sbaglio??

Fabrizio Mondo wrote a comment on May 3, 2008

@Fabrizio:

Se sei sicuro di avere messo tutto alla perfezione, il problema può derivare da listen2myradio.

Vincola l’utilizzo alla pagina internet che si crea con ogni account, per cui è probabile che non si possa sentire con player embedded esterni.

Lian Dyer wrote a comment on May 5, 2008

Per chi vuole un player Flash per gli stream in formato .ogg, forse finché non esistono gli conviene attendere… Hai letto questa notizia, immagino:
Adobe trasforma Flash in piattaforma aperta
http://www.lastampa.it/_web/cmstp/tmplrubriche/tecnologia/grubrica.asp?ID_blog=30&ID_articolo=4478&ID_sezione=38&sezione=News
Anche se nella mia ignoranza non so giudicare quanto sia rigorosa la notizia.
Per quanto mi riguarda, io anziché trasmettere con streamtranscoder in 2 formati (mp3 e ogg) che mi consumerebbe il doppio di banda, preferisco trasmettere in diretta in ogg e poi mettere le “repliche” in mp3.
Ciao

Fabrizio Mondo wrote a comment on May 6, 2008

@Lian Dyer:

E’ una soluzione. Per quanto riguarda l’apertura di flash, meglio aspettare prima di esultare.

Gnurant wrote a comment on May 8, 2008

Qundi in casi come
mms://217.169.108.45/wmtencoder/58247118.wmv
oppure
http://ourstream.redirectme.net
non si può fare nulla?
Son Gnurant, ma non me ne Vant!

Fabrizio Mondo wrote a comment on May 8, 2008

@Gnurant:

Ti addottrino io ;)
Purtroppo no. Perchè si tratta di un player per radio con shoutcast. Studierò altre possibilità.

annaelle wrote a comment on June 3, 2008

Ciao Fabrizio, rieccomi con qualche questito: SAM mi sta facendo un po’ impazzire… ma per fortuna ci sono le tue guide.
Ho provato questo player flash ma non riesco proprio a capire perchè non funzioni.
Creo una pagina solo con il codice da te postato, l’unica cosa che vado a sostituire è l’ url dello streaming ma niente… la pagina continua a restituirmi il messaggio di installare flash 8 che ormai ho reisntallato più e più volte (dico solo che l’ho provato anche da un PC che ha installato non il plugin ma proprio Flash 8) All’inizio pensavo dipendesse da come scrivevo l’indirizzo dello streaming: ho provato mettendo http:// davanti al numero IP, togliendolo, mettendo lo “/” dopo il numero della porta e tutte le varie combinazioni ma niente da fare: la pagina continua a non funzionare. Ho provato anche a modificare l’estensione della pagina, prima asp e poi html e ancora niente.
Uso shoutcast e sam. l’ho provato sia con ie 6.0 (dici essere troppo vecchia come versione?) e firefox 2.0.

Fabrizio Mondo wrote a comment on June 3, 2008

@Annaelle:

Se ti dice di installare flash 8, è perchè manca il plugin flash, che è cosa totalmente diversa dal flash normale, utilizzato per lo sviluppo di file swf o applicazioni.

Posso dirti che sostituito l’url con il tuo indirizzo personale, dovrebbe andare. Eventualmente, posta l’indirizzo della pagina, proverò io a vedere l’errore.

annaelle wrote a comment on June 5, 2008

grazie per la risposta fabrizio, il problema è che anche avendo installato più volte il plugin di flash continua a non funzionare… mentre vedo correttamente sia la demo del player che altri filmati in flash quindi il problema non può essere il plugin. Mi sa che sbaglio qualcosa io.
Se puoi provare a dare un’occhiata tu mi faresti un favorone, l’indirizzo è:

la versione .asp
http://www.annaelle.it/radio/
oppure
la versione .html
http://www.annaelle.it/radio/flash_importato.html

annaelle

Fabrizio Mondo wrote a comment on June 5, 2008

@Annaelle:

Ti consiglio per adesso caldamente di utilizzare altri sistemi di embedding, e ti dico anche il perchè.

A quanto risulta, è possibile scaricare tutto il pacchetto completo dal sito di nativeradio (prima avevo dovuto fare una sorta di reverse engineering) compresi i file necessari alla creazione del player, ovvero il file html contenente il codice di cui sopra all’articolo.

Peccato però, che il player non funzioni in nessun browser, sia esso internet explorer o firefox.

Sto studiando i motivi. Risulta inaccessibile l’ascolto anche in DEFAULT MODE ovvero senza cambiare nessunissima impostazione. La cosa strana però, è che i riferimenti sono corretti, ovvero il server shoutcast a cui punta il player flash, esiste ed è online.

Molti siti lo hanno rimosso, come ad esempio radioradicchio.it oppure sciax2.it per ritornare a player embedded tradizionali.

Appena ho novità o trovo una soluzione ne farò nota in questo stesso articolo.

Stay tuned.

P.S
a questo indirizzo: http://www.fabriziomondo.com/storage/nativeradio/example.html ho montato un esempio. Come si vede, il player è online e funzionante (a quanto sembra non si può più richiamare dal sito internet di nativeradio direttamente, e, in ogni caso, tu avevi messo un http:// di troppo nel secondo parametro so.AddVariable(”streamurl”,), ed è questo il motivo per cui non ti funzionava correttamente) ma purtroppo non rileva il flusso, pur essendo esistente.

annaelle wrote a comment on June 5, 2008

Grazie mille!
http:// mi deve essere rimasto dalle mille prove fatte.
Ma che sfortuna!
Quindi cambio. Sto cercando online del codice ActionScript per provare a fare un semplicissimo player in flash: mi accontento di un parti e fermati. Se riesco a combinare qualcosa di decente te lo posto.

Mi sto ponendo il problema del player perchè il mediaplayer mi risolve il problema dei PC ma per il mac non sono ancora riuscita a trovare il modo di far ascoltare la radio. Hai qualche suggerimento? Ho provato con Quicktime e devo dire che l’embed funziona egregiamente, solo che è decisamente meno diffuso di Flash.

Grazie ancora e terrò d’occhio, come sempre, questo blog!

Fabrizio Mondo wrote a comment on June 5, 2008

@Annaelle:

Per i mac è sufficente dare un file pls, itunes lo leggerà.

n1ck0 wrote a comment on June 12, 2008

Ciao Fabrizio,
sono Luca da RadioRadicchio.

Credo di aver capito qual’e’ il problema con nativeplayer.

Nella nuova implementazione l’oggetto flash
utilizza delle chiamate a degli script php. Ad esempio
per poter recuperare il titolo della canzone attualmente
in onda usa streamtitle.php che va a leggere la pagina html
:/7.html tramite l’apertura di un socket con
una chiamata a ‘fsockopen’.

Il problema consiste nel fatto che alcuni servizi di hosting
disabilitano connessioni in uscita su porte diverse dalla 80 per
politiche di sicurezza.

Nell’esempio che hai preparato qui
http://www.fabriziomondo.com/storage/nativeradio/example.html
ad esempio utilizzi la porta 8032.
Magari anche interfree non permette connessioni su porte
diverse da 80 ed e’ per quello che non funziona.

Ho fatto una prova in locale e tutto funziona correttamente.

Sto pensando a qualche soluzione.

n1ck0 wrote a comment on June 12, 2008

la pagina che viene letta da streamtitle.php e’

server_shoutcast:porta/7.html

avevo usato dei caratteri strani e non e’ stata visualizzata correttamente.

Luca

Fabrizio Mondo wrote a comment on June 12, 2008

@N1ck0:

Concordo con la tua ipotesi. Non so se interfree attui questa politica, però è probabile.

fammi sapere…

Gianfranco wrote a comment on October 4, 2008

Ciao Fabrizio,
ci siamo sentiti un po’ di tempo fa, ricordi? Sto ancora lottando con i problemi che ti avevo segnalato (AACPlus, server streaming in Linux, ecc.).
Dopo aver tirato su Icecast2, sia con Ices2 (Vorbis OGG) che con Ices0 (MP3), ma senza riuscire comunque a far partire questa benedetta radio in AACPlus, ho deciso di farmi un player Flash, che vedi all’indirizzo

http://vm203052.planetacomnetwork.com/music3001/flash/

(ovviamente, graficamente e’ ancora in fase embrionale).
Carica una playlist in formato XML di file M4A (AACPlus), tira fuori i metadata, titolo e artista glieli passo da XML, e li suona. Insomma, funziona. C’e’ solo un problema: come si comportera’ in caso di richieste multiple? ci vorra’ un Flash Media Server?
Considera che la versione attuale e’ fatta col component FLVPlayback, quella definitiva secondo me dovra’ lavorare direttamente da codice (netstream), ma adesso mi premeva far vedere qualcosa al cliente alla svelta…

fabrymondo wrote a comment on October 4, 2008

@Gianfranco:

Tutto dipende dal tipo di radio.. e dal tipo di server di streaming che usa.

Solitamente non è necessario un flash media server per lo streaming di una web radio, perchè molti prediligono l’utilizzo di un server di streaming svincolato da flash, almeno per il solo audio.

Se il tuo discorso evolverà in video.. allora sarà il caso di parlarne.

Per cose più tecniche su flash posso rimandarti a qualche amico flashista, per me è solo una competenza trasversale.

Gianfranco wrote a comment on October 4, 2008

> Solitamente non è necessario un flash media server per lo
> streaming di una web radio, perchè molti prediligono l’utilizzo
> di un server di streaming svincolato da flash, almeno per il solo audio.

Anch’io avrei preferito di gran lunga non dover fare un player Flash apposito.
Dici che potevo utilzzare proprio il player di cui parli in questo articolo? Purtroppo no, perche’ il guaio e’ sempre il solito: il player vuole comunque un flusso streaming entrante in formato AACPlus, ed e’ proprio questa parte quella che non riesco a risolvere…

Sotto l’aspetto tecnico, non ho problemi a lavorare in Flash, quello che mi manca e’ proprio la conoscenza del “mondo” streaming, quindi se l’amico flashista puo’ aiutarmi, ben venga!
E grazie ancora Fabrizio :-)

fabrymondo wrote a comment on October 6, 2008

@Gianfranco:

Non parlavo di questo player, ma di un player in generale. Per flash non dovrebbe essere un problema gestire un flusso AACPlus, in quanto lui riceve sempre in pasto un file di playlist. Devo però informarmi sulla sua fattibilità, prendi con le punze le mie informazioni.

Vedrò di muovermi per chiedere ai flashisti :D

Grazie a te, fammi pubblicità!

Gianfranco wrote a comment on October 7, 2008

Prego Fabrizio, figurati.
Peccato che nel frattempo il cliente mi abbia annullato l’ordine, che ha dato ad un altra azienda.
Sapevo che sarebbe finita cosi’… :-(

fabrymondo wrote a comment on October 7, 2008

@Gianfranco:

(imprecazioni varie in diverse lingue)

Ti rifarai.

d_gabba wrote a comment on November 15, 2008

Il player non funziona, io è un pò che ci combatto, quello di radio radicchio mi sembra un po un escamotage :)
Comunque nel caso riuscissi a farlo funzionare ve lo faccio sapere

d_gabba wrote a comment on November 15, 2008

ahem…..mi rimangio ciò che ho detto circa l’escamotage in effetti sembra funzionare bene! Hey radioradicchio magari ho bisogno del vostro aiuto…. i file che mette a disposizione Sodah sono tutti da inserire nella directory per essere caricati dal codice? O ha bisogno solo dell’oggetto .js?

Care to comment?