Agora Real-Time STT — 전사·번역 메시지 처리

[사용자 마이크] → Agora RTC 채널
                       ↓
            Real-Time STT 작업이 채널 참여
                       ↓
                 ASR → Translation
                       ↓
            RTC DataStream으로 Protobuf 결과 전송
                       ↓
            클라이언트: Protobuf 역직렬화 → UI 렌더링

const requestBody = {
  name: `stt-agent-${Date.now()}`,
  languages: ["ko-KR"],
  maxIdleTime: 300,
  rtcConfig: {
    channelName,
    pubBotUid: "88888",
    pubBotToken, // App Certificate 사용 시 필요
    subscribeAudioUids: [String(localUid)],
  },
  translateConfig: {
    languages: [
      { source: "ko-KR", target: ["en-US"] },
    ],
  },
};

// 서버 프록시가 POST /api/speech-to-text/v1/projects/{appid}/join 호출
const res = await fetch("/api/stt", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ action: "join", requestBody }),
});
const { agent_id: agentId } = await res.json();

await fetch("/api/stt", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ action: "leave", agentId }),
});

import protoRoot from "@/protobuf/SttMessage_es6.js";

rtcClient.on("stream-message", (uid, payload) => {
  if (String(uid) !== STT_PUB_BOT_UID) return;

  const Text = protoRoot.Agora.SpeechToText.lookup("Text");
  const message = Text.decode(payload);
  handleSttMessage(message);
});

{
  "uid": "1234",
  "data_type": "transcribe",
  "words": [{ "text": "안녕하세요", "is_final": false }],
  "culture": "ko-KR",
  "text_ts": "1753359520754",
  "sentence_id": "1753359518654"
}

{
  "data_type": "translate",
  "trans": [
    { "is_final": true, "lang": "en-US", "texts": ["Hello"] }
  ],
  "original_transcript": {
    "culture": "ko-KR",
    "words": [{ "text": "안녕하세요", "is_final": true }]
  },
  "sentence_id": "1753359518654"
}

진행 중 (activeCards)                 완료 (completedCards)
┌──────────────────────────┐         ┌──────────────────────┐
│  UID "1234":             │         │ (완료된 발화들)       │
│    ├ 안녕하세요   → Hello │         │                      │
│    ├ 반갑습니다   → Nice  │         │                      │
└──────────────────────────┘         └──────────────────────┘

const segmentKey = `${message.uid}:${message.sentence_id}`;

segments.set(segmentKey, {
  ...segments.get(segmentKey),
  transcript: message.words.map((word) => word.text).join(""),
  isFinal: message.words.every((word) => word.is_final),
  textTs: message.text_ts,
});

최종 번역 도착 → 1초 타이머 시작
                  ↓
같은 사용자의 새 결과 도착 → clearTimeout(타이머)
                  ↓
                 기존 카드 갱신

Main Client (UID: random)     Screen Client (UID: 55555)
├── Audio Track (mic)          ├── Video Track (screen)
├── Video Track (camera)       └── (audio disabled)
└── STT stream-message listener

// 별도 client 생성 및 채널 참여
const screenClient = AgoraRTC.createClient({ mode: "rtc", codec: "vp8" });
await screenClient.join(
  APP_ID,
  channelName,
  screenToken,
  SCREEN_SHARE_UID_SUFFIX,
);

// 화면 캡처 트랙 생성 및 publish
const screenTrack = await AgoraRTC.createScreenVideoTrack(
  { optimizationMode: "detail" },
  "disable", // 오디오 비활성화
);
await screenClient.publish([screenTrack]);