Skip to main content
플러그인으로 돌아가기
@capgo/capacitor-youtube-player
튜토리얼
@capgo/capacitor-youtube-player

유튜브 플레이어

유튜브 비디오를 완전한 플레이어 API 제어와 이벤트 처리와 함께 임베드하세요

가이드

유튜브 플레이어 튜토리얼

장치에서 테스트

Capgo 앱을 다운로드하고, QR code을 스캔하세요.

유튜브 플레이어 플러그인 미리보기 QR code

Using @capgo/capacitor-youtube-player

Capacitor용 유튜브 플레이어 플러그인 인터페이스. 앱에서 유튜브 비디오 재생을 제어하는 방법을 제공합니다.

설치

bun add @capgo/capacitor-youtube-player
bunx cap sync

이 플러그인이 노출하는 것

  • initialize - 새로운 유튜브 플레이어 인스턴스를 초기화합니다.
  • destroy - 플레이어 인스턴스를 삭제하고 자원을 해제합니다.
  • stopVideo - 비디오 재생을 중지하고 로딩을 취소합니다. 이 메서드를 사용할 때는 주의하십시오. - pauseVideo()는 일반적으로 선호됩니다.
  • playVideo - 현재 큐드 또는 로드된 비디오를 재생합니다. 최종 플레이어 상태는 PLAYING(1)입니다.

메인 웹뷰 REFERER 패치

활성화 patchRefererHeader YouTube 콘텐츠는 플러그인에서 작동하지만 Capacitor의 메인 WebView에서 실패하는 이유는 YouTube가 브라우저와 같은 환경을 기대하기 때문입니다. Referer 헤더.

{
  "plugins": {
    "YoutubePlayer": {
      "patchRefererHeader": true,
      "refererHeader": "https://www.youtube.com"
    }
  }
}

이 패치는 youtube.com, youtube-nocookie.com, 및 youtu.be 요청에만 적용됩니다. 기존 요청 수준 Referer 헤더는 보존되고 refererHeader 기본값은 https://www.youtube.com omitted 경우

기본값입니다.

initialize

예시 사용

import { YoutubePlayer } from '@capgo/capacitor-youtube-player';

await YoutubePlayer.initialize({
  playerId: 'my-player',
  videoId: 'dQw4w9WgXcQ',
  playerSize: { width: 640, height: 360 },
  privacyEnhanced: true
});

destroy

새로운 YouTube 플레이어 인스턴스를 초기화합니다.

import { YoutubePlayer } from '@capgo/capacitor-youtube-player';

await YoutubePlayer.destroy({} as PlayerIdOptions);

stopVideo

플레이어 인스턴스를 삭제하고 리소스를 해제합니다. 비디오 재생을 중지하고 로딩을 취소합니다. 이 기능을 사용할 때는 주의해야합니다. - pauseVideo()는 일반적으로 선호됩니다.

import { YoutubePlayer } from '@capgo/capacitor-youtube-player';

await YoutubePlayer.stopVideo({} as PlayerIdOptions);

playVideo

현재 재생 중인 비디오를 재생합니다. 최종 플레이어 상태는 PLAYING (1)입니다.

import { YoutubePlayer } from '@capgo/capacitor-youtube-player';

await YoutubePlayer.playVideo({} as PlayerIdOptions);

전체 참조

Using @capgo/capacitor-youtube-player

이러한 기능을 사용하는 경우 Using @capgo/capacitor-youtube-player 자연스러운 미디어 및 인터페이스 동작을 계획하려면 @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-youtube-player 자연스러운 미디어 및 인터페이스 동작을 계획하려면 @capgo/capacitor-youtube-player 자연스러운 미디어 및 인터페이스 동작을 계획하려면 @capgo/capacitor-youtube-player Getting Started __CAPGO_KEEP_0__ Using @capgo/capacitor-live-activities for the native capability in Using @capgo/capacitor-live-activities, @capgo/capacitor-live-activities for the implementation detail in @capgo/capacitor-live-activities, and Using @capgo/capacitor-video-player for the native capability in Using @capgo/capacitor-video-player.