Sito web · 2026 — oggi
CoolZone WebRadio — sito web
CoolZone WebRadio è il sito di una web radio in streaming 24/7 che ho sviluppato nel 2026 in PHP e JavaScript, con classifica e pannello admin. La classifica settimanale è curata da Tom Palmer e importa copertine e anteprime audio da iTunes. Un'API versionata fornisce il brano in onda all'app mobile.
Contesto
CoolZone WebRadio è una web radio condotta da Tom Palmer che trasmette musica in streaming 24 ore su 24. Nel 2026 ho riprogettato e sviluppato da zero il sito coolzonewebradio.it in PHP e JavaScript; la direzione artistica, il logo e la palette colori sono di Tom Palmer, mentre il codice l'ho scritto io con l'assistenza di agenti di programmazione AI.
Il sito di CoolZone WebRadio ha tre tipi di utenti. Gli ascoltatori vogliono sentire la diretta, anche dal telefono. Tom Palmer cura personalmente ogni settimana una classifica di brani e deve poterla aggiornare in autonomia, senza toccare il codice. L'app mobile di CoolZone WebRadio, infine, ha bisogno di leggere dal sito il brano in onda.
Obiettivo
L'obiettivo era un sito leggero, sicuro e gestibile in autonomia: player in primo piano, classifica con copertine e anteprime audio, pannello di gestione e un'API stabile per l'app.
Cosa ho fatto
Player e streaming
Il player in diretta è IskRadioPlayer, un player che ho sviluppato come progetto separato e che il sito incorpora in un iframe. Lo stream audio arriva da un server di streaming esterno.
Come funziona la classifica settimanale?
La classifica "International Music Chart" mostra i primi dieci brani scelti da Tom Palmer, con i primi tre su un podio. I dati stanno in un file JSON, non in un database: per una decina di voci aggiornate una volta a settimana MySQL sarebbe stato un peso inutile. Se la classifica personalizzata è vuota, il sito mostra in automatico la Billboard Hot 100 da un feed JSON pubblico, con una cache di un'ora.
Le copertine arrivano dalla iTunes Search API e vengono salvate in una cache locale in alta risoluzione. Ogni brano può avere un'anteprima di 30 secondi da iTunes: suona un solo brano alla volta e la diretta va in pausa, così i due audio non si sovrappongono.
Il pannello di gestione
Il pannello di amministrazione permette a Tom Palmer di aggiungere, togliere e riordinare i brani, anche trascinandoli. Per inserire un brano basta incollare il link Apple Music: il pannello ricava l'ID della traccia e il paese dal link, interroga la iTunes Lookup API e compila titolo, artista, copertina e anteprima. Dallo stesso pannello si modificano testi, link agli store e ID di Google Analytics.
Sicurezza e privacy
- Password con hash bcrypt, blocco dopo troppi tentativi di accesso, sessione che scade dopo un periodo di inattività.
- Token CSRF su ogni form e su ogni chiamata AJAX del pannello.
- Content Security Policy con nonce generato a ogni richiesta e HSTS.
- Google Analytics caricato solo dopo il consenso esplicito ai cookie, con IP anonimizzato.
Mobile
Il layout è responsive, con regole dedicate per smartphone in verticale e in orizzontale e animazioni ridotte per chi le disattiva nel sistema. Su iOS e Android un banner propone l'app giusta per il sistema operativo.
La parte più difficile
La parte più difficile è stata far leggere il brano in onda all'app Android. L'app chiamava direttamente l'endpoint del player e riceveva un errore 403, mentre browser e curl ottenevano una risposta regolare. La causa era un filtro di sicurezza a monte del server, che bloccava le richieste del client HTTP nativo di Android.
Come arriva il brano in onda all'app mobile?
L'app mobile legge il brano in onda da un endpoint pubblico versionato, /api/v1/nowplaying, che ho scritto in PHP. L'endpoint interroga il player lato server con cURL, quindi la richiesta che arriva al filtro non è più quella del client Android. Ho verificato la correzione su un dispositivo Android reale.
Le copertine avevano lo stesso problema, quindi ho aggiunto un proxy anche per le immagini. Il proxy accetta solo nomi di file in un formato prestabilito, per impedire richieste arbitrarie verso altri server. Il v1 nel percorso dell'API è voluto: un'app già installata non si aggiorna subito, quindi eventuali cambi incompatibili andranno in una v2.
Risultato
Il sito di CoolZone WebRadio è online su coolzonewebradio.it. Tom Palmer aggiorna la classifica ogni settimana dal pannello, senza intervento tecnico, e l'app mobile legge il brano in onda dall'API /api/v1/nowplaying.
L'app mobile di CoolZone WebRadio ha un caso studio a parte: CoolZone WebRadio — app mobile.