muc

Muc

Conversor de URL de música

Um aplicativo simples a ser capturado em um URL de vários serviços de streaming de música e mostre a mesma faixa (quando disponível) de outros serviços de streaming. Você pode ver uma demonstração ao vivo @ https://muc.anirbanmu.com/?Queries[].

Params de consulta

• queries[]=spotify:track:2HYr8LZRlJKEfMbIgT0365 - Param de consulta do tipo de matriz (pode ter múltiplas) que podem ser passadas como consultas iniciais para o aplicativo.

Serviços suportados

Atualmente, ele suporta o Spotify, YouTube, iTunes/Apple Music & Deezer.

Configurar

• Verifique se você tem o nó & npm instalado
• Clone o repo
• cd no diretório repo
• npm install

Front-end

O front -end deve ser construído e pronto para ir antes que o back -end possa servir com sucesso ao aplicativo.

Para o desenvolvimento (construirá, procure mudanças e reconstruir o frontend vue.js):

 npm run build-watch

Para produção (apenas construirá):

 npm run build

Os arquivos construídos são colocados no diretório ./dist .

Back -end

O back -end exige que as teclas da API sejam definidas para que as respectivas APIs possam ser usadas.

 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]

Depois de definir as variáveis ​​do ambiente, você pode iniciar o servidor de back -end localmente com:

 npm run express

Agora você deve poder acessar o aplicativo localmente @ http: // localhost: 8081

fly.io

O aplicativo está pronto para ser implantado no Fly.io. Basta criar um aplicativo com FLYCTL e substituir o <APP-NAME> em Fly.toml. Depois de criar o aplicativo e substituiu o nome em 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> Se você deseja o código de verificação do site do Google na página, caso contrário, basta flyctl deploy .

Detalhes

Front-end

A maior parte do código do aplicativo é o lado do cliente, que é um aplicativo vue.js. Isso lida com toda a prestação, análise de URLs e conversando -os em outros serviços.

Back -end

O back -end consiste em um servidor expresso muito trivial que é o único objetivo é obter alguns dados iniciais do lado do servidor (tokens de API) e modelar o aplicativo Vue.js de página única para que ele possa ser executado de forma independente do back -end. Ele também serve uma API para obter os tokens da API sozinhos, para que o front -end possa atualizar os tokens periodicamente.