Se você já sabe criar um player de áudio com HTML puro, não há nenhum grande mistério aqui.
Só para relembrar, esse é o código para um player elegante e minimalista que vai tocar um único áudio mp3:
Resultado com um áudio .mp3:
Seu navegador não é compatível com HTML 5 O que você precisa ter é o link exato do streaming. Não é o arquivo com extensão .pls ou .m3u, mas sim o que tem dentro dele.
Este, por exemplo, é o link de streaming da rádio Smooth Jazz Mix New York:
http://hestia2.cdnstream.com:80/1078_128 Colocando esse mesmo link no código — no lugar do arquivo .mp3 — temos o player da rádio, que você pode incorporar facilmente em outro site:
Seu navegador não é compatível com HTML 5 Aí você acha o player sem graça e quer exibir uma imagem de fundo. Os programadores de verdade vão me esganar agora, mas é só colocar o áudio dentro do elemento
Resultado:
É claro que existem formas mais sensatas de fazer isso, mas nenhuma delas é tão legal quanto enganar o navegador colocando ele para tocar uma rádio dentro do elemento de vídeo. Chrome, Edge, Firefox e Opera: todos os quatro caíram no truque.
Para achar o link de transmissão de uma rádio do Icecast, por exemplo, é só salvar o arquivo .m3u, .xspf ou .pls no seu computador e abrir o mesmo no bloco de notas. Lá dentro você encontra o link do streaming.
Abaixo, por exemplo, o código com os links de transmissão da rádio Hear Me - Very Best of Country:
A mesma rádio você pode ouvir abaixo:
Seu navegador não é compatível com HTML 5 Groove Salad - Soma FM: Seu navegador não é compatível com HTML 5 Drone Zone - Soma FM: Seu navegador não é compatível com HTML 5 ATENÇÃO | Não incorpore rádio web em um site público sem autorização dos donos da rádio.
Para autoplay e outras configurações, confira os posts:
Até mais!
Artigo exclusivo do Meu Tédio, blog da Helen Fernanda. Reprodução proibida.