muc

Mu

Convertidor de URL musical

Una aplicación simple para tomar una URL de varios servicios de transmisión de música y mostrar la misma pista (cuando esté disponible) de otros servicios de transmisión. Puedes ver una demostración en vivo @ https://muc.anirbanmu.com/?queriesche=spotify:track:2hyr8lzrljkefmbigt0365

Parámetros de consulta

• queries[]=spotify:track:2HYr8LZRlJKEfMbIgT0365 - parámetro de consulta de tipo de matriz (puede tener múltiples) que se pueden pasar como consultas iniciales a la aplicación.

Servicios compatibles

Actualmente es compatible con Spotify, YouTube, iTunes/Apple Music & Deezer.

Configuración

• Asegúrese de tener el nodo y NPM instalado
• Clonar el repositorio
• cd en directorio de repo
• npm install

Interfaz

La parte delantera debe ser construida y lista para comenzar antes de que el backend pueda servir con éxito a la aplicación.

Para el desarrollo (construirá, observará cambios y reconstruirá vue.js frontend):

 npm run build-watch

Para la producción (solo construirá):

 npm run build

Los archivos construidos se colocan en el directorio ./dist .

Backend

El backend requiere que se establezcan las teclas API para que se puedan usar las API respectivas.

 SPOTIFY_CLIENT_ID=<spotify client ID> [REQUIRED]
SPOTIFY_CLIENT_SECRET=<spotify client secret> [REQUIRED]
YOUTUBE_API_KEY=<youtube API key> [REQUIRED]
GOOGLE_SITE_VERIFICATION_CODE=<google site verification code via meta tag> [OPTIONAL]

Después de haber establecido las variables de entorno, puede iniciar el servidor de backend localmente con:

 npm run express

Ahora debería poder acceder a la aplicación localmente @ http: // localhost: 8081

mosca.io

La aplicación está lista para implementarse en Fly.io. Simplemente cree una aplicación con FlyCTL y reemplace el <APP-NAME> en Fly.toml. Después de haber creado la aplicación y reemplazar el nombre en Fly.toml:

• flyctl secrets set SPOTIFY_CLIENT_ID=<spotify client ID> [REQUIRED]
• flyctl secrets set SPOTIFY_CLIENT_SECRET=<spotify client secret> [REQUIRED]
• flyctl secrets set YOUTUBE_API_KEY=<youtube API key> [REQUIRED]
• flyctl deploy --build-secret GOOGLE_SITE_VERIFICATION_CODE=<google site verification code via meta tag> Si desea el código de verificación del sitio de Google en la página, de lo contrario, simplemente flyctl deploy .

Detalles

Interfaz

La mayor parte del código de aplicación es el lado del cliente, que es una aplicación Vue.js. Esto maneja toda representación, análisis de URL y convertirlas en otros servicios.

Backend

El backend consiste en un servidor expreso muy trivial que el único propósito es obtener algunos datos iniciales del lado del servidor (tokens API) y plantarse la aplicación Vue.js de página única para que luego pueda ejecutarse independientemente del backend. También sirve una API para obtener los tokens API solos para que la interfaz pueda actualizar sus tokens periódicamente.