본문으로 건너뛰기

자동 연속 녹음 중지

자동 연속 녹음 루프를 중단합니다. 현재 녹음 중인 내용은 전송하지 않고 폐기됩니다.

메서드​

stopAutoRecording()​

자동 연속 녹음 루프를 중지합니다.

public stopAutoRecording(): void

동작 방식​

  1. 자동 연속 녹음 루프를 즉시 중단합니다
  2. 현재 진행 중인 녹음 데이터는 전송하지 않고 폐기됩니다
  3. AI TTS 응답 대기 중이라면 해당 대기도 취소됩니다
  4. 녹음 상태가 idle로 초기화됩니다

사용법​

JavaScript/TypeScript​

import { KleverOneClient } from "@klever-one/web-sdk/core";

const client = new KleverOneClient({
  apiKey: "your-api-key",
  container: document.getElementById("streaming-container"),
});

await client.connect();

// 자동 연속 녹음 시작
await client.startAutoRecording();

// 대화 종료 시 중지
client.stopAutoRecording();

React Hook​

"use client";

import { useRef, useEffect, useMemo, useState } from "react";
import { useKleverOneClient } from "@klever-one/web-sdk/react";

function MyComponent() {
  const containerRef = useRef(null);
  const [isAutoRecording, setIsAutoRecording] = useState(false);
  const tempContainer = useMemo(() => {
    if (typeof document !== "undefined") {
      return document.createElement("div");
    }
    return {} as HTMLDivElement;
  }, []);

  const client = useKleverOneClient({
    apiKey: "your-api-key",
    container: containerRef.current || tempContainer,
  });

  useEffect(() => {
    return () => {
      if (client.client) {
        client.disconnect();
      }
    };
  }, [client.client]);

  const handleStopAutoRecording = () => {
    client.client.stopAutoRecording();
    setIsAutoRecording(false);
    console.log("자동 연속 녹음 중지!");
  };

  return (
    <div>
      <div
        ref={containerRef}
        className="h-[400px] w-[800px] bg-black"
      ></div>
      <button
        onClick={handleStopAutoRecording}
        disabled={!isAutoRecording}
      >
        자동 녹음 중지
      </button>
      <p>녹음 상태: {client.state.recording}</p>
    </div>
  );
}

관련 기능​