본문 바로가기

시작하기

GitHub

AI-Assisted Setup으로 플러그인을 설치할 수 있습니다. 다음 명령어로 AI 도구에 Capgo 스킬을 추가하세요:

터미널 창
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

그런 다음 아래 프롬프트를 사용하세요:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-video-thumbnails` plugin in my project.

수동 설정을 선호한다면, 다음 명령어를 실행하여 플러그인을 설치하고 아래의 플랫폼별 지침을 따르세요:

터미널 창
bun add @capgo/capacitor-video-thumbnails
bunx cap sync
import { CapgoVideoThumbnails } from '@capgo/capacitor-video-thumbnails';
import { CapgoVideoThumbnails } from '@capgo/capacitor-video-thumbnails';
const result = await CapgoVideoThumbnails.getThumbnail({
sourceUri: 'file:///path/to/video.mp4',
time: 5000,
quality: 0.8
});
console.log('Thumbnail URI:', result.uri);
console.log('Dimensions:', result.width, 'x', result.height);

자주 하는 실수

“흔한 실수” 섹션
  • 네이티브 동기화: 실행 bunx cap sync 플러그인 업그레이드 후.
  • 신뢰할 수 있는 소스: 신뢰 src/definitions.ts GitHub 레포지토리에서.

비디오 파일의 특정 시점에서 썸네일 이미지를 생성합니다.

import { CapgoVideoThumbnails } from '@capgo/capacitor-video-thumbnails';
const result = await CapgoVideoThumbnails.getThumbnail({
sourceUri: 'file:///path/to/video.mp4',
time: 5000,
quality: 0.8
});
console.log('Thumbnail URI:', result.uri);
console.log('Dimensions:', result.width, 'x', result.height);

타입 레퍼런스

“타입 참조” 섹션

비디오 썸네일 생성 옵션

export interface VideoThumbnailsOptions {
/**
* The URI of the video file. Can be a local file path or a remote URL.
* For local files, use file:// protocol or absolute path.
* For remote files, use http:// or https:// protocol.
*/
sourceUri: string;
/**
* The time position in milliseconds from which to extract the thumbnail.
* Defaults to 0 (first frame).
*/
time?: number;
/**
* Quality of the generated image, from 0.0 (lowest) to 1.0 (highest).
* Defaults to 1.0.
*/
quality?: number;
/**
* HTTP headers to include when fetching remote video URIs.
* Only applicable for remote URLs.
*/
headers?: Record<string, string>;
}

썸네일 생성 결과.

export interface VideoThumbnailsResult {
/**
* The local URI path to the generated thumbnail image.
* This can be used directly in img tags or Image components.
*/
uri: string;
/**
* Width of the generated thumbnail in pixels.
*/
width: number;
/**
* Height of the generated thumbnail in pixels.
*/
height: number;
}

이 페이지는 플러그인의 src/definitions.tsupstream에서 public API가 변경되면 sync를 다시 실행하세요.

사용 중이라면 시작하기 네이티브 미디어 및 인터페이스 동작을 계획하려면, 이를 다음 항목과 연결하세요: @capgo/capacitor-video-thumbnails 사용 @capgo/capacitor-video-thumbnails 사용에서의 네이티브 기능, @capgo/capacitor-live-activities 사용 @capgo/capacitor-live-activities 사용에서의 네이티브 기능, @capgo/capacitor-live-activities @capgo/capacitor-live-activities의 구현 세부 사항, @capgo/capacitor-video-player 사용 @capgo/capacitor-video-player 사용에서의 네이티브 기능 및 @capgo/capacitor-video-player @capgo/capacitor-video-player.의 구현 세부 사항