图图音频
TutuAudio · 삽입 가능한 컴포넌트

코드 한 줄로,몇 초 만에 사이트에 오디오 편집기를 추가하세요

TutuAudio 편집기(자르기 / 노이즈 제거 / 믹싱 / 마스터링)를 어떤 웹사이트에나 삽입하세요. 방문자는 사이트 내에서 바로 오디오를 편집할 수 있고, 테마는 구성 가능하며, 제품 업데이트는 자동으로 적용됩니다 — 당신은 유지 관리가 전혀 필요 없습니다.

복사해서 붙여넣기 · 페이지의 </body> 태그 앞에
<script src="https://tutuaudio.com/embed.js"
        data-key="pk_live_YOUR_KEY"
        data-mount="#aa-editor" defer></script>

pk_live_YOUR_KEY를 콘솔에서 생성한 키로 교체하세요. 컨테이너 #aa-editor에는 너비와 높이가 필요합니다. 도메인 허용/차단 목록을 설정하여 당신의 사이트에서만 표시되도록 할 수 있습니다.

실시간으로 체험하기

아래 버튼을 클릭하여 삽입된 오디오 편집기를 바로 여기서 체험해 보세요.

JS API (콜백 / 커스터마이징이 필요할 때)

<script src="https://tutuaudio.com/embed.js"></script>
<script>
  const aa = TutuAudio.mount('#aa-editor', {
    key: 'pk_live_YOUR_KEY',
    theme: 'auto',            // auto | light | dark
    onSave: (file) => {
      // file.dataUrl = the finished mix (WAV, base64)
      upload(file.dataUrl);
    }
  });
  aa.open('https://your.site/sound.mp3'); // import an audio clip
</script>

전체 구성 옵션

매개변수타입설명
keystring당신의 공개 키 pk_ (콘솔에서 생성). 필수.
theme'auto'|'light'|'dark'테마. auto는 호스트/시스템의 밝게 또는 어둡게 모드를 따릅니다.
saveTextstring「완료」 버튼 문구(기본값 「완료 후 반환」, ≤16자). onSave가 설정되면 이 버튼은 편집기의 기본 상단 바에 표시됩니다.
hideSuiteboolean패밀리 런처를 숨깁니다(삽입 시 기본적으로 숨김, 방해 요소 감소).
hideAccountboolean로그인/계정 컨트롤을 숨깁니다(삽입 시 기본적으로 숨김. 호스트가 로그인을 관리).
hideExportboolean편집기 내장 내보내기/다운로드 버튼을 숨깁니다(「완료 후 반환」만 사용할 때).
hideLangboolean언어 전환을 숨깁니다(호스트가 tt_locale로 제어).
hideThemeboolean밝게/어둡게 전환을 숨깁니다(호스트가 tt_theme로 제어).

메서드

  • aa.open(url, name?)오디오 클립을 트랙으로 가져옵니다(오디오/비디오/이미지 url 또는 dataURL).
  • aa.export()믹스를 오프라인으로 렌더링하고 WAV로 내보냅니다 → Promise<{dataUrl,mime,size}>.
  • aa.setTheme('dark')런타임에 테마를 전환합니다.
  • aa.destroy()컴포넌트를 언마운트합니다(iframe 제거).

이벤트 콜백

  • onReady()편집기가 준비되었습니다.
  • onSave(file)사용자가 「완료」를 클릭 → file.dataUrl은 완성된 믹스(WAV)입니다.
  • onError(e)e.message는 사람이 읽을 수 있는 형식입니다(미활성화 / 권한 없음 / 로드 실패).
  • onClose()전체 화면 오버레이가 닫혔습니다.

보안 · 자동 업데이트

  • · 키는 공개됩니다. 삽입 사이트 허용/차단 목록으로 도용을 방지합니다(차단 목록 우선). 언제든지 일시 중지하거나 재개할 수 있습니다.
  • · 편집기는 TutuAudio 자체 도메인에서 실행됩니다(격리). 당신의 페이지는 어떤 TutuAudio 자격 증명에도 접근할 수 없습니다.
  • · 컴포넌트는 TutuAudio가 자체 호스팅하고 자동 업데이트합니다 —— 기능 업그레이드에 당신 쪽의 코드 변경이 필요 없으며, 유지 관리는 전혀 없습니다.