Aller directement au contenu principal
Retour aux plugins
@capgo/capacitor-player-youtube
Guide
@capgo/capacitor-player-youtube

Player YouTube

Intégrer des vidéos YouTube avec un contrôle et une gestion d'événements complets du lecteur API

Guide

Tutoriel sur le lecteur YouTube

Tester sur appareil

Télécharger l'application Capgo, puis scannez le code QR code.

Lien QR de prévisualisation du plugin de lecteur YouTube code

Utilisation de @capgo/capacitor-youtube-player

YouTube Player Plugin interface for Capacitor. Provides methods to control YouTube video playback in your app.

Installer

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

Ce que ce plugin expose

  • initialize - Initialiser une nouvelle instance de lecteur YouTube.
  • destroy - Détruire une instance de lecteur et libérer les ressources.
  • stopVideo - Arrêter la lecture vidéo et annuler la charge. Utilisez cela avec parcimonie - pauseVideo() est généralement préféré.
  • playVideo - Jouer la vidéo actuellement en attente ou chargée. L'état final du lecteur sera PLAYING (1).

Patch de référentiel de WebView principal

Activer patchRefererHeader lorsque le contenu YouTube fonctionne dans le plugin mais échoue dans la vue principale de Capacitor car YouTube attend un navigateur Referer en-tête.

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

La mise à jour ne s'applique qu'à youtube.com, youtube-nocookie.com, et youtu.be les requêtes. Les en-têtes de requête existants sont préservés, et Referer par défaut lorsque cela n'est pas spécifié. refererHeader Exemple d'utilisation https://www.youtube.com Initialisez une nouvelle instance de lecteur YouTube.

Détruit une instance de lecteur et libère les ressources.

initialize

Arrêtez la lecture vidéo et annulez la charge. Utilisez cela avec parcimonie - pauseVideo() est généralement préféré.

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

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

destroy

when YouTube content works in the plugin but fails from __CAPGO_KEEP_0__'s main WebView because YouTube expects a browser-like

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

await YoutubePlayer.destroy({} as PlayerIdOptions);

stopVideo

header.

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

await YoutubePlayer.stopVideo({} as PlayerIdOptions);

playVideo

Playez la vidéo actuellement cued ou chargée. L'état final du lecteur sera PLAYING (1).

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

await YoutubePlayer.playVideo({} as PlayerIdOptions);

Référence complète

Continuez de l'utilisation de @capgo/capacitor-youtube-player

Si vous utilisez L'utilisation de @capgo/capacitor-youtube-player pour planifier le comportement de médias et d'interface natifs, connectez-le avec @capgo/capacitor-youtube-player pour les détails d'implémentation dans @capgo/capacitor-youtube-player, Démarrage pour les détails d'implémentation dans Getting Started, En utilisant @capgo/capacitor-activités-en-vive pour la capacité native dans En utilisant @capgo/capacitor-activités-en-vive, @capgo/capacitor-activités-en-vive pour les détails d'implémentation dans @capgo/capacitor-activités-en-vive, et En utilisant @capgo/capacitor-joueur-de-videos pour la capacité native dans En utilisant @capgo/capacitor-joueur-de-videos.