En primer lugar, crear una nueva base de datos SQL. Vamos a llamar a radio . Una vez hecho esto, tenemos que crear una tabla. Tan sólo hay 4 campos: un ID, la dirección URL de mp3, el nombre del artista y el título de la canción. Aquí está el código SQL para utilizar con el fin de crear la tabla denominada songs :

Ahora tenemos una base de datos y una tabla para almacenar información básica acerca de las canciones que vamos a jugar en nuestra radio. Ahora hay que rellenar la tabla. Elija algunos archivos mp3 e insertar la siguiente declaración en su base de datos:

En este momento, la base de datos está listo.

Creación del HTML

Por supuesto, tenemos que crear una página HTML. En primer lugar, apoderarse de su copia de jPlayer , el plugin jQuery que vamos a utilizar para crear la radio en línea. Descomprimir el archivo, a continuación, cargar los js/ y skin/ de su servidor.

A continuación, cree un archivo llamado demo.html en su servidor e introduzca el código siguiente en él:

Este código ha sido tomada de demostraciones de JPlayer. Se trata de un código HTML simple que insertar los archivos necesarios JavaScript (jQuery + el plugin jPlayer), así como el CSS y HTML que se utiliza para mostrar el reproductor de música. En este momento, el jugador no se muestran correctamente: Todavía tenemos que utilizar un poco de jQuery para animar. Veremos que en un minuto.

Obtención de archivos de la base de datos

Ahora, tenemos que crear un archivo PHP que conseguirá una canción al azar de la base de datos y mostrar la URL del archivo, así como el nombre de la canción y el artista por lo que podemos agarrarlo con Ajax. En primer lugar, obtener su copia de ezSQL que he elegido para gestionar mis consultas de bases de datos.  descomprimir los archivos y cargarlos ez_sql_core.php yez_sql_mysql.php al servidor.

Una vez hecho esto, cree un archivo llamado getsong.php en el servidor. Pegue el siguiente código en él:

Nada complicado: He incluido los archivos necesarios ezSQL, creado una conexión con la base de datos, a continuación, solicita una fila de la songs tabla. Los 3 valores (URL del archivo, artista, y el nombre de la canción) se muestran en la pantalla, separadas por un tubo.

La sentencia condicional se utiliza para detectar las peticiones Ajax y evitar que la gente sea capaz de mostrar canciones url simplemente escribiendo http://www.yousite.com/getsong.php en su barra de direcciones del navegador.

Haciendo que funcione

Muy bien, casi hemos terminado. Lo que necesitamos ahora es utilizar algún jQuery para solicitar una canción utilizando Ajax y nuestragetsong.php archivo. A continuación, vamos a utilizar jPlayer para reproducirlo.

Abra su demo.html y pegar el siguiente después de la línea 10:

Ahora, si guarda el archivo y apunta su navegador a http://www.yoursite.com/demo.html~~V, su radio debería funcionar: Se pone una canción de la base de datos y reproducirlo. Cuando la canción termina, otro se selecciona automáticamente.

Probablemente hay mejores formas de escribir el código (Tiene una gran cantidad de código redundante, lo cual es siempre una mala práctica), así que no dude en escribir un comentario si usted tiene una mejor versión de sugerir.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *