Интерфейс разговора в реальном времени OpenAI

POST https://88api.ai/v1/realtime/sessions
Content-Type: application/json
Authorization: Bearer $NEW_API_KEY

{
  "model": "gpt-4o-realtime-preview-2024-12-17",
  "voice": "verse"
}

sequenceDiagram
    participant Client
    participant Server
    participant OpenAI

    alt WebRTC соединять
        Client->>Server: Запросить временный токен
        Server->>OpenAI: Создать сеанс
        OpenAI-->>Server: Вернуть временный токен
        Server-->>Client: Вернуть временный токен

        Client->>OpenAI: создавать WebRTC offer
        OpenAI-->>Client: возвращаться answer

        Note over Client,OpenAI: Учреждать WebRTC соединять

        Client->>OpenAI: Создать канал данных
        OpenAI-->>Client: Подтвердить канал передачи данных
    else WebSocket соединять
        Server->>OpenAI: Учреждать WebSocket соединять
        OpenAI-->>Server: Подтвердите соединение

        Note over Server,OpenAI: Начать живой разговор
    end

async function init() {
  // Получить временный ключ с сервера - См. код сервера ниже.
  const tokenResponse = await fetch('/session');
  const data = await tokenResponse.json();
  const EPHEMERAL_KEY = data.client_secret.value;

  // Создать одноранговое соединение
  const pc = new RTCPeerConnection();

  // Устанавливает удаленный звук, возвращаемый моделью воспроизведения.
  const audioEl = document.createElement('audio');
  audioEl.autoplay = true;
  pc.ontrack = (e) => (audioEl.srcObject = e.streams[0]);

  // Добавить локальную звуковую дорожку для входа в микрофон браузера
  const ms = await navigator.mediaDevices.getUserMedia({
    audio: true,
  });
  pc.addTrack(ms.getTracks()[0]);

  // Настройте каналы данных для отправки и получения событий
  const dc = pc.createDataChannel('oai-events');
  dc.addEventListener('message', (e) => {
    // Получайте события сервера в реальном времени здесь！
    console.log(e);
  });

  // Использовать протокол описания сеанса(SDP)Начать сеанс
  const offer = await pc.createOffer();
  await pc.setLocalDescription(offer);

  const baseUrl = 'https://88api.ai/v1/realtime';
  const model = 'gpt-4o-realtime-preview-2024-12-17';
  const sdpResponse = await fetch(`${baseUrl}?model=${model}`, {
    method: 'POST',
    body: offer.sdp,
    headers: {
      Authorization: `Bearer ${EPHEMERAL_KEY}`,
      'Content-Type': 'application/sdp',
    },
  });

  const answer = {
    type: 'answer',
    sdp: await sdpResponse.text(),
  };
  await pc.setRemoteDescription(answer);
}

init();

import express from 'express';

const app = express();

// Создайте конечную точку для генерации временных токенов.
// Эта конечная точка используется вместе с приведенным выше клиентским кодом.
app.get('/session', async (req, res) => {
  const r = await fetch('https://88api.ai/v1/realtime/sessions', {
    method: 'POST',
    headers: {
      Authorization: `Bearer ${process.env.NEW_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      model: 'gpt-4o-realtime-preview-2024-12-17',
      voice: 'verse',
    }),
  });
  const data = await r.json();

  // будет изOpenAI REST APIполученныйJSONОтправить обратно клиенту
  res.send(data);
});

app.listen(3000);

// Создайте канал данных из однорангового соединения
const dc = pc.createDataChannel('oai-events');

// Слушайте события сервера на канале данных
// Данные о событии необходимо получить изJSONРазбор строк
dc.addEventListener('message', (e) => {
  const realtimeEvent = JSON.parse(e.data);
  console.log(realtimeEvent);
});

// Отправлять клиентские события：Сериализуйте действительные клиентские события для
// JSON，и отправляется по каналу данных
const responseCreate = {
  type: 'response.create',
  response: {
    modalities: ['text'],
    instructions: 'Write a haiku about code',
  },
};
dc.send(JSON.stringify(responseCreate));

import WebSocket from 'ws';

const url =
  'wss://88api.ai/v1/realtime?model=gpt-4o-realtime-preview-2024-12-17';
const ws = new WebSocket(url, {
  headers: {
    Authorization: 'Bearer ' + process.env.NEW_API_KEY,
    'OpenAI-Beta': 'realtime=v1',
  },
});

ws.on('open', function open() {
  console.log('Connected to server.');
});

ws.on('message', function incoming(message) {
  console.log(JSON.parse(message.toString()));
});

# Необходимо установить библиотеку websocket-client:
# pip install websocket-client

import os
import json
import websocket

NEW_API_KEY = os.environ.get("NEW_API_KEY")

url = "wss://88api.ai/v1/realtime?model=gpt-4o-realtime-preview-2024-12-17"
headers = [
    "Authorization: Bearer " + NEW_API_KEY,
    "OpenAI-Beta: realtime=v1"
]

def on_open(ws):
    print("Connected to server.")

def on_message(ws, message):
    data = json.loads(message)
    print("Received event:", json.dumps(data, indent=2))

ws = websocket.WebSocketApp(
    url,
    header=headers,
    on_open=on_open,
    on_message=on_message,
)

ws.run_forever()

/*
Уведомление：В клиентской среде, такой как браузер，Мы рекомендуем использоватьWebRTC。
Но вDenoиCloudflare WorkersВ среде браузера, такой как，
Вы также можете использовать стандартныйWebSocketинтерфейс。
*/

const ws = new WebSocket(
  'wss://88api.ai/v1/realtime?model=gpt-4o-realtime-preview-2024-12-17',
  [
    'realtime',
    // Сертификация
    'openai-insecure-api-key.' + NEW_API_KEY,
    // Необязательный
    'openai-organization.' + OPENAI_ORG_ID,
    'openai-project.' + OPENAI_PROJECT_ID,
    // Betaпротокол，необходимый
    'openai-beta.realtime-v1',
  ]
);

ws.on('open', function open() {
  console.log('Connected to server.');
});

ws.on('message', function incoming(message) {
  console.log(message.data);
});

// Получать события сервера
ws.on('message', function incoming(message) {
  // Нужно начать сJSONАнализ данных сообщения
  const serverEvent = JSON.parse(message.data);
  console.log(serverEvent);
});

// Отправить событие，Создайте формат событий на стороне клиентаJSONструктура данных
const event = {
  type: 'response.create',
  response: {
    modalities: ['audio', 'text'],
    instructions: 'Give me a haiku about code.',
  },
};
ws.send(JSON.stringify(event));

# Отправлять клиентские события, сериализовать словарь в JSON
def on_open(ws):
    print("Connected to server.")

    event = {
        "type": "response.create",
        "response": {
            "modalities": ["text"],
            "instructions": "Please assist the user."
        }
    }
    ws.send(json.dumps(event))

# Для получения сообщения требуется анализ полезных данных сообщения из JSON.
def on_message(ws, message):
    data = json.loads(message)
    print("Received event:", json.dumps(data, indent=2))