
Esta es una actualización en tiempo real Spotify Connect Visualizer, que ha tenido su base de código base hecha en medio día.
Este proyecto tiene licencia bajo la licencia GNU GPL-3.0.
Disponible en Nowplayi.ng

Generador de mini jugadores
Página de estado
v2.0.x
- Use of localStorage
- Added GNU GPL-3.0 license
- Updated Index page design
- Updated French and English sentences
- Compatibility with Dark Reader
- Better UI consistency / CSS tweaks
- More languages
- .env support (thanks @finnie2006!)
- Added playback support (Premium account should be needed)
- Added playback information
- Added pause button (#17)
- CSS improvements added for better responsive (#15 #16)
- SEO improvements (#16)
- Minor CSS improvements
- Advertisements are recognized
- Multiple artists are recognized
- Experimental theme switcher
- Now playing device name and type is showing
- Cursor is hidden after a couple of seconds
- Fullscreen button
HTML, Tailwindcss, JS / Alpinejs, PHP
Spotify Web API PHP de Jwilsson para obtener el token y actualizar el token, Spotify Web API JS de Jmperez para recuperar y mostrar la canción de reproducción actualmente
Puede usar XAMPP (multiplataforma) o WampServer (solo Windows), pero cualquier servidor web con PHP 7.0 o más es bueno de usar, con el módulo php-curl .
! Si está en Nginx, debe agregar esto a su configuración, o de lo contrario su .env estará expuesto a Internet.
location /.env {
allow [YourIP]; # Allow your IP if you want to, if not delete this line.
deny all;
}
Debe tener una aplicación declarada en el tablero de desarrolladores de Spotify para obtener una Client ID .
Cómo hacer esto: como dije, lo primero es crear una ID de cliente ( Create a Client ID ) en el tablero de desarrolladores de Spotify. Escriba el nombre de su aplicación en el campo de texto App or Hardware name , y su descripción en el campo de texto de App or Hardware description . ¿En What are you building ? Sección, indique la plataforma para la que está creando la aplicación, luego haga clic en el botón NEXT . Responda a la pregunta de integración comercial y continúa. Si es necesario, llene el formulario y marque todas las casillas en la tercera etapa y estará listo para comenzar. ¡Su aplicación se declara en el tablero de desarrolladores de Spotify!
Ahora que tiene su aplicación, tiene algunas modificaciones que hacer en un archivo: .env . (Si no existe, copie example.env a .env )
Editar esos valores:
YOUR_CLIENT_ID por su identificación de cliente disponible en el panel de su aplicación,YOUR_CLIENT_SECRET por su Client Secret disponible haciendo clic en el botón Show Client Secret situado en la misma página web que su ID de cliente,YOUR_DOMAIN por su URL de redirección, en el caso de un alojamiento local, reemplácela por http://localhost/token.php en la mayoría de los casos. Básicamente, es la URL accesible para la página token.php . Volvamos al panel de nuestra aplicación. Debe declarar la URL donde se encuentra la página token.php , para un alojamiento local, en la mayoría de los casos sería http://localhost/token.php . Haga clic en el botón Edit settings verde situado en la parte superior de la página, luego en el campo de texto Redirect URIs , indique el suyo. Atención : ¡lo que escribió debería ser imperativamente lo mismo que escribió en los dos archivos precedentes! Luego haga clic en el botón SAVE en la parte inferior del formulario. ¡Su aplicación está declarada y lista para usar!
Puede incluir un script de análisis opcional, utilizando la variable de entorno ANALYTICS_SCRIPT .
Si se establece, esta variable se incluirá en la parte <head> de todas las páginas. Es muy probable que esta variable sea una cadena que contenga una etiqueta <script> .
Flags de Freepik del sitio web www.flaticon.com bajo Creative Commons por licencia 3.0.