Usando @capgo/capacitor-youtube-player
Plugin de YouTube Player para Capacitor. Ofrece métodos para controlar la reproducción de videos de YouTube en tu app.
Instalar
bun add @capgo/capacitor-youtube-player
bunx cap sync
Lo que expone este plugin
initialize- Inicializa una nueva instancia del reproductor de YouTube.destroy- Destruye una instancia del reproductor y libera recursos.stopVideo- Detiene la reproducción y cancela la carga. Úsalo con moderación; suele ser mejor usar pauseVideo().playVideo- Reproduce el video en cola o cargado. El estado final del reproductor será PLAYING (1).
Parche del Referer en la WebView principal
Activar patchRefererHeader cuando el contenido de YouTube funciona en el plugin pero falla desde la WebView principal de Capacitor porque YouTube espera un Referer header.
{
"plugins": {
"YoutubePlayer": {
"patchRefererHeader": true,
"refererHeader": "https://www.youtube.com"
}
}
}
El parche solo se aplica a youtube.com, youtube-nocookie.com, y youtu.be peticiones. Los headers existentes a Referer nivel de petición se preservan, y refererHeader por defecto es https://www.youtube.com cuando se omiten.
Ejemplo de uso
initialize
Inicializa una nueva instancia del reproductor de YouTube.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.initialize({
playerId: 'my-player',
videoId: 'dQw4w9WgXcQ',
playerSize: { width: 640, height: 360 },
privacyEnhanced: true
});
destroy
Destruye una instancia del reproductor y libera recursos.
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
const result = await YoutubePlayer.destroy({ playerId: 'player-id-123' });
console.log(result);
stopVideo
Detiene la reproducción y cancela la carga. Úsalo con moderación; normalmente es mejor pauseVideo().
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
const result = await YoutubePlayer.stopVideo({ playerId: 'player-id-123' });
console.log(result);
playVideo
Reproduce el video actualmente en cola o cargado. El estado final del reproductor será PLAYING (1).
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
const result = await YoutubePlayer.playVideo({ playerId: 'player-id-123' });
console.log(result);
Referencia completa
- GitHub: https://github.com/Cap-go/capacitor-youtube-player/
- Docs: /docs/plugins/youtube-player/
Continuar desde Usando @capgo/capacitor-youtube-player
Si estás usando Usando @capgo/capacitor-youtube-player para planificar el comportamiento de los medios nativos y la interfaz, conéctalo con @capgo/capacitor-youtube-player para los detalles de implementación en @capgo/capacitor-youtube-player, Primeros pasos para los detalles de implementación en Primeros pasos, Uso de @capgo/capacitor-live-activities para la capacidad nativa en Uso de @capgo/capacitor-live-activities, @capgo/capacitor-live-activities para el detalle de implementación en @capgo/capacitor-live-activities, y Uso de @capgo/capacitor-video-player para la capacidad nativa en Uso de @capgo/capacitor-video-player.