OpenAI Realtime API Next.js: um modelo Next.js para criar aplicativos de IA de diálogo de voz em tempo real

Introdução geral

O OpenAI Realtime API Next.js é um projeto de código aberto baseado na estrutura Next.js, projetado para ajudar os desenvolvedores a criar rapidamente aplicativos de IA de voz em tempo real. O projeto integra a API em tempo real da OpenAI e a tecnologia WebRTC, fornecendo componentes modernos de interface do usuário e ferramentas para chamar a função. Ao usar esse modelo, os desenvolvedores podem criar facilmente aplicativos de IA de voz que suportam conversas de áudio em tempo real com localização em vários idiomas. O projeto também inclui segurança rigorosa do tipo TypeScript e regras de eslint para garantir a qualidade e a manutenção do código.

Demonstração on-line: https://openai-rt-shadcn.vercel.app/

Lista de funções

• Estrutura Next.jsRenderização no lado do servidor e roteamento de API usando Next.js.
• Interface do usuário modernizadaDesign de animação com Tailwind CSS e Framer Motion, usando componentes shadcn/ui.
• Suporte a WebRTCGancho: fornece um gancho que abstrai o processamento de WebRTC para simplificar a implementação de diálogos de áudio em tempo real.
• Chamada de ferramentaContém cinco funções de amostra que demonstram o uso de ferramentas do lado do cliente em conjunto com a API em tempo real.
• Localização em vários idiomasSuporte para selecionar o idioma (inglês, espanhol, francês, chinês) no qual as cadeias de caracteres e os agentes de voz são aplicados.
• segurança de tipoUse TypeScript e siga rigorosamente as regras do eslint.

Usando a Ajuda

Processo de instalação

1. armazém de clones

   git clone https://github.com/cameronking4/openai-realtime-api-nextjs.git
cd openai-realtime-api-nextjs

2. Configurações ambientais No diretório raiz, crie um arquivo.enve adicione sua chave de API da OpenAI:

   OPENAI_API_KEY=sua-openai-api-chave

3. Instalação de dependências Se estiver usando o Node.js:

   npm install

Se estiver usando o Deno:

   instalação do deno

4. Executar o aplicativo Se estiver usando o Node.js:

   npm run dev

Se estiver usando o Deno:

   início da tarefa do deno

O aplicativo será executado nohttp://localhost:3000.

Instruções de uso

1. Abra o aplicativo Abrir em seu navegadorhttp://localhost:3000.
2. Selecionar voz Selecione uma voz e inicie uma sessão de áudio.
3. Chamada de ferramenta O projeto fornece cinco funções de amostra que mostram como chamar a ferramenta no lado do cliente:
   • getCurrentTimeHora atual: obtém a hora atual.
   • partyModeMudança para o modo de festa.
   • changeBackground: Alterar o plano de fundo.
   • launchWebsiteLançamento do site.
   • copyToClipboardCopiar para a área de transferência.
4. Suporte a vários idiomas A localização multilíngue de strings de aplicativos e agentes de voz pode ser obtida selecionando-se diferentes idiomas.

Implantação em Vercel

1. Implementação em um clique Com a plataforma Vercel, o aplicativo pode ser implantado com um único clique.
2. Configuração de variáveis de ambiente Nas configurações de projeto do Vercel, adicione sua chave de API do OpenAI.

licenças

O projeto é de código aberto sob a licença MIT, consulte o arquivo LICENSE para obter detalhes.

uma nota de agradecimento

Agradecemos à OpenAI pela API e pelos modelos, à estrutura Next.js, ao Tailwind CSS pelo estilo e ao blog de Simon Willison pela inspiração.