

Este projeto é o resultado de uma combinação e o desenvolvimento contínuo de dois dos meus projetos anteriores:
Em 2023, no meio do hype do ChatGPT, fiquei inspirado a combinar meus dois projetos anteriores em um jogador de podcast e melhorá -lo, utilizando as APIs do Open AI.
FYI: O Spotify lançou mais tarde uma solução semelhante para legendas e capítulos de podcast, leia mais aqui.
As tecnologias usadas neste projeto podem ser encontradas na tabela abaixo.
| Tecnologia | Caso de uso |
|---|---|
| Reagir | Estrutura de front -end |
| Tailwind | Biblioteca de estilo CSS |
| Python | Back -end para lidar com a lógica de transcrição |
| Balão | Conecta o back -end do Python com o React Frontend |
| Spotify API | Para obter informações sobre episódios de podcast |
| API de reconhecimento de fala do Google | Converte fala em texto, ou seja, transcreve o podcast |
| API GPT 3.5 da AIR da IA | Transcrição do segmento em capítulos com base na transcrição |
Eu queria aprender a conectar um front -end do React a um back -end do Python, então usei esse projeto como uma oportunidade de aprendizado para fazer isso. Como resultado, fiz um pouco de engenharia excessiva, construindo minha própria API para lidar com transcrições em um back-end do Python, em vez de chamar uma API plug-and-play no front-end.
Mais especificamente, o front -end faz uma chamada para a API do Spotify e recebe o URL do podcast solicitado. O URL é enviado como uma solicitação para o back -end que baixará o podcast como um MP3 para processá -lo.
O motivo pelo qual o MP3 precisa ser processado é que eu preciso obter registros de data e hora para cada frase para exibi -los no momento correto nas legendas. Identino frases na transcrição ouvindo um silêncio (<14 decibéis) com mais de 500 ms. Quando um silêncio é identificado, divido o arquivo de áudio original para criar um conjunto de arquivos de áudio menores, um para cada frase. Ao fazer isso, consegui calcular o horário de início e término de cada frase, olhando para o comprimento de cada arquivo de áudio menor, veja a figura abaixo.

Todos os arquivos de áudio agora são enviados para a API de reconhecimento de fala do Google e retorna uma sequência do áudio transcrito. A transcrição está agora sendo enviada de volta ao front -end, que solicita a API da IA para segmentar a transcrição e identificar possíveis tópicos para dividir o episódio em diferentes capítulos.
A API do Spotify não permite que você baixe episódios completos de podcast, apenas 30 segundos visualizações. Isso torna o aplicativo muito limitado ao uso e, portanto, é apenas uma prova de conceito.
Crie um arquivo .env no diretório raiz e adicione suas chaves da API:
REACT_APP_SPOTFY_CLIENT_ID=YOUR_SPOTIFY_CLIENT_ID_GOES_HERE
REACT_APP_OPEN_AI_KEY=YOUR_OPEN_AI_KEY_GOES_HERE
Use os seguintes comandos para executar o projeto. Inicie o front -end em um terminal e o back -end em outro terminal.
export FLASK_APP=backend
export FLASK_DEBUG=1
flask run
cd frontend
npm start
Assista a uma demonstração de 1 min do projeto aqui.

Página inicial com autenticação do Spotify

Página de descoberta

Tela de carregamento

Tela de episódio

Tela de episódio

Legendas em tela cheia

Visão geral dos capítulos dentro de um episódio

Player de áudio dividido por capítulos

Transcrição da pesquisa