Integrar o ChatGPT em uma aplicação Node.js usando TypeScript pode adicionar um poderoso recurso de processamento de linguagem natural ao seu projeto. Portanto esta integração permite que você envie prompts ao ChatGPT e receba respostas diretamente na sua aplicação. Então neste guia, vamos explorar passo a passo como buscar prompts simples utilizando a API do ChatGPT em um projeto Node.js com TypeScript, abordando desde a configuração inicial até a implementação completa.

Pré-requisitos

Antes de começar, então certifique-se de ter:

• Node.js e npm instalados em sua máquina.
• TypeScript instalado globalmente.
• Uma chave de API do OpenAI (você pode obter uma em OpenAI).
• Conhecimento básico de Node.js e TypeScript.

Configuração do Ambiente

1. Inicializando o Projeto

Crie um novo diretório para o seu projeto e inicialize um novo projeto Node.js:

mkdir chatgpt-integration
cd chatgpt-integration
npm init -y

Instale o TypeScript e as definições de tipo necessárias:

npm install typescript ts-node @types/node --save-dev

Crie o arquivo tsconfig.json para configurar o TypeScript:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "outDir": "./dist"
  },
  "include": ["src"]
}

2. Estrutura do Projeto

Crie a seguinte estrutura de diretórios e arquivos:

chatgpt-integration/
├── src/
│   ├── index.ts
│   ├── services/
│   │   └── ChatGPTService.ts
│   └── controllers/
│       └── ChatGPTController.ts
├── tsconfig.json
├── package.json

3. Instalando Dependências

Instale o axios para fazer requisições HTTP e as definições de tipo:

npm install axios
npm install @types/axios --save-dev

Configurando a Chave de API do OpenAI

Adicione sua chave de API do OpenAI ao arquivo .env. Crie o arquivo .env na raiz do projeto:

OPENAI_API_KEY=your_openai_api_key

Instale o pacote dotenv para carregar variáveis de ambiente:

npm install dotenv
npm install @types/dotenv --save-dev

Criando o Serviço para a API do ChatGPT

1. Implementando o Serviço

No arquivo ChatGPTService.ts, adicione o seguinte código:

import axios from 'axios';
import dotenv from 'dotenv';

dotenv.config();

export class ChatGPTService {
  private apiKey: string;

  constructor() {
    this.apiKey = process.env.OPENAI_API_KEY!;
  }

  public async getResponse(prompt: string): Promise<string> {
    try {
      const response = await axios.post('https://api.openai.com/v1/engines/davinci-codex/completions', {
        prompt: prompt,
        max_tokens: 150,
      }, {
        headers: {
          'Authorization': `Bearer ${this.apiKey}`,
          'Content-Type': 'application/json',
        },
      });

      return response.data.choices[0].text.trim();
    } catch (error) {
      console.error('Error fetching response from OpenAI:', error);
      return 'No response';
    }
  }
}

Criando um Controller para Lidar com Requisições

1. Implementando o Controller

No arquivo ChatGPTController.ts, adicione o seguinte código:

import { Request, Response } from 'express';
import { ChatGPTService } from '../services/ChatGPTService';

export class ChatGPTController {
  private chatGPTService: ChatGPTService;

  constructor() {
    this.chatGPTService = new ChatGPTService();
  }

  public async getResponse(req: Request, res: Response): Promise<void> {
    const { prompt } = req.body;

    if (!prompt) {
      res.status(400).send('Prompt is required');
      return;
    }

    const response = await this.chatGPTService.getResponse(prompt);
    res.json({ response });
  }
}

Configurando o Servidor Express

1. Instalando Dependências

Instale o express e as definições de tipo:

npm install express
npm install @types/express --save-dev

2. Implementando o Servidor

No arquivo index.ts, adicione o seguinte código:

import express from 'express';
import { json, urlencoded } from 'body-parser';
import { ChatGPTController } from './controllers/ChatGPTController';

const app = express();
const port = 3000;
const chatGPTController = new ChatGPTController();

app.use(json());
app.use(urlencoded({ extended: true }));

app.post('/chatgpt', (req, res) => chatGPTController.getResponse(req, res));

app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}/`);
});

Testando a Integração

Para testar a integração, você pode usar um cliente HTTP como Postman ou cURL para enviar uma requisição POST ao endpoint /chatgpt com um prompt simples.

Exemplo de Requisição com cURL

curl -X POST http://localhost:3000/chatgpt \
     -H "Content-Type: application/json" \
     -d '{"prompt": "Hello, how are you?"}'

Exemplo de Interface Simples

Para completar, vamos criar uma interface simples para interagir com o ChatGPT.

1. Criando uma Página HTML Simples

Crie um arquivo index.html na pasta public:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ChatGPT Integration</title>
</head>
<body>
    <form id="chat-form">
        <label for="prompt">Enter your prompt:</label>
        <input type="text" id="prompt" name="prompt" required>
        <button type="submit">Send</button>
    </form>
    <div id="response"></div>

    <script>
        document.getElementById('chat-form').addEventListener('submit', function (event) {
            event.preventDefault();
            const prompt = document.getElementById('prompt').value;

            fetch('/chatgpt', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'Accept': 'application/json'
                },
                body: JSON.stringify({ prompt: prompt })
            })
            .then(response => response.json())
            .then(data => {
                document.getElementById('response').innerText = data.response;
            })
            .catch(error => console.error('Error:', error));
        });
    </script>
</body>
</html>

Conclusão

Integrar o ChatGPT com Node.js e TypeScript é um processo direto que pode adicionar um recurso de linguagem natural valioso à sua aplicação. Portanto neste guia, cobrimos desde a configuração inicial até a implementação de um endpoint que interage com a API do ChatGPT, além de uma interface simples para testar a funcionalidade. Com essas etapas, você pode facilmente expandir e personalizar a integração de acordo com as necessidades do seu projeto.