본문으로 건너뛰기

비디오 업로드

⚠️ 현재 SDK 의 cb.video.uploadcb.video.storage.upload 는 둘 다 chunk 단계에서 백엔드와 어긋납니다.

  • 최상위 cb.video.upload: POST /v1/public/uploads + POST .../chunks 호출, 백엔드는 POST /v1/public/uploads/init + PUT .../chunk (단수형)
  • cb.video.storage.upload: init/complete 경로는 정렬되어 있지만 chunk 가 POST, 백엔드는 PUT

정렬 전까지 안전한 유일한 방법은 raw fetch 로 직접 호출하는 것입니다 (앱 멤버 JWT 필수):

  • 채널 없는 일반 업로드: POST /v1/public/uploads/initPUT /v1/public/uploads/:id/chunk (반복) → POST /v1/public/uploads/:id/complete
  • 스토리지 분리 업로드: POST /v1/public/storages/videos/:storageID/uploads/initPUT .../chunkPOST .../complete

아래의 cb.video.upload(...) 사용 예제는 SDK ↔ 백엔드 정렬 후의 목표 인터페이스입니다. 현재 환경에서 그대로 복붙하면 404/405 에러가 납니다.

cb.video.upload(file, options) 는 청크 업로드(initUpload → uploadChunk × N → completeUpload)를 SDK 내부에서 자동으로 처리합니다. 별도로 청크를 직접 다룰 필요가 없습니다.

기본 업로드

typescript
const fileInput = document.getElementById('video-input') as HTMLInputElement
const file = fileInput.files?.[0]
if (!file) throw new Error('파일을 선택해주세요')

const video = await cb.video.upload(file, {
    title: '동영상 제목',
    description: '동영상 설명',
    visibility: 'public',         // 'public' | 'unlisted' | 'private'
    tags: ['vlog', 'travel']
})

console.log('업로드 완료:', video.id)
console.log('초기 상태:', video.status)  // 보통 'processing'

진행률 표시

upload()onProgress 콜백이 청크 단위로 호출됩니다.

typescript
const video = await cb.video.upload(file, {
    title: '동영상 제목',
    visibility: 'public',
    onProgress: (progress) => {
        console.log(`${progress.phase}: ${progress.percentage}%`)
        // phase: 'uploading' | 'finalizing'
        // percentage: 0~100
        // currentSpeed: bytes/sec
    }
})

트랜스코딩 완료 대기

업로드 직후 비디오 상태는 processing 입니다. 트랜스코딩이 끝나야 ready 가 되어 재생 가능합니다.

typescript
const video = await cb.video.upload(file, { title: '...', visibility: 'public' })

// 트랜스코딩 완료까지 polling 대기 (최대 5분)
const ready = await cb.video.waitForReady(video.id, {
    timeout: 5 * 60 * 1000,
    interval: 5000
})
console.log('재생 가능:', ready.status)  // 'ready'

트랜스코딩 상태 직접 조회

⚠️ 현재 SDK 의 cb.video.getTranscodeStatus / retryTranscode 는 동작하지 않습니다. SDK 는 /v1/public/videos/:videoId/transcode/status 로 호출하지만, 백엔드는 /v1/apps/:appID/videos/:videoId/transcode/status (콘솔 JWT 전용)에만 라우트를 노출합니다 — 경로/인증 모두 다릅니다.

일반 클라이언트는 cb.video.waitForReady(videoId, { timeout, interval })status === 'ready' 가 될 때까지 get 을 폴링하는 방식만 사용하세요. 콘솔 페이지 안에서는 사용자 JWT 로 /v1/apps/:appID/videos/:videoId/transcode/status 를 직접 fetch 하면 됩니다.

다중 스토리지로 업로드

typescript
const video = await cb.video.storage.upload(storageId, file, {
    title: '동영상 제목',
    visibility: 'public'
})