Primeros pasos
Copia un prompt de configuración con los pasos de instalación y la guía completa en markdown para este plugin.
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-mux-player`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/mux-player/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
Instalar
Sección titulada “Instalación”Puedes usar nuestro setup asistido por IA para instalar el plugin. Añade las skills de Capgo a tu herramienta de IA con el siguiente comando:
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-pluginsLuego usa el siguiente prompt:
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-mux-player` plugin in my project.Si prefieres la configuración manual, instala el plugin ejecutando estos comandos y sigue las instrucciones de cada plataforma:
bun add @capgo/capacitor-mux-playerbunx cap syncImportar
Sección titulada “Importar”import { MuxPlayer } from '@capgo/capacitor-mux-player';Inicio rápido
Sección titulada “Inicio rápido”import { MuxPlayer } from '@capgo/capacitor-mux-player';
const { active } = await MuxPlayer.isActive();if (active) return;await MuxPlayer.play({ playbackId: 'YOUR_PLAYBACK_ID',});Ejemplo: reproducción firmada
Sección titulada “Ejemplo: reproducción firmada”Pasa el token de reproducción que tu backend genera para DRM o políticas firmadas, tal como se indica en el README del plugin.
Errores comunes
Sección titulada “Errores comunes”- Reproductor único: verificar
isActive()antes de llamar aplay()de nuevo. - Limpieza al cerrar: escucha el evento de cierre si necesitas reanudar el video del WebView inline después.
- Los tokens caducan: refresca los JWT firmados en el servidor antes de sesiones largas.
Resumen de API
Sección titulada “Resumen de API”Inicia el Mux Player nativo en pantalla completa y comienza la reproducción.
import { MuxPlayer } from '@capgo/capacitor-mux-player';
await MuxPlayer.play({ playbackId: 'playback-id-123' });dismiss
Sección titulada “dismiss”Cierra el reproductor si está visible.
import { MuxPlayer } from '@capgo/capacitor-mux-player';
await MuxPlayer.dismiss();isActive
Sección titulada “isActive”Indica si el reproductor se está mostrando actualmente.
import { MuxPlayer } from '@capgo/capacitor-mux-player';
const result = await MuxPlayer.isActive();console.log(result);Referencia de tipos
Sección titulada “Referencia de tipos”MuxPlayOptions
Sección titulada “MuxPlayOptions”export interface MuxPlayOptions { /** * The playback ID of the asset you want to stream. */ playbackId: string; /** * Provide a JSON web token generated for signed playback policies. */ playbackToken?: string; /** * Provide a JSON web token generated for DRM playback policies. */ drmToken?: string; /** * Override the default Mux playback domain (e.g. `stream.example.com`). */ customDomain?: string; /** * Auto-play when the player becomes visible. Defaults to true. */ autoPlay?: boolean; /** * Start playback from the provided time (in seconds). */ startTime?: number; /** * Provide a poster image URL to display before playback begins. */ poster?: string; /** * Provide a custom title to surface in native player chrome when available. */ title?: string; /** * Provide a subtitle or description to surface in native player chrome when available. */ subtitle?: string; /** * Set to true to keep the video muted when playback starts. */ muted?: boolean; /** * Mux Data environment key used for analytics. If omitted, the SDK default is used. */ environmentKey?: string; /** * Provide an explicit player name for analytics. Defaults to a generated name. */ playerName?: string; /** * Enable smart caching when the underlying SDK supports it. */ enableSmartCache?: boolean; /** * Enable verbose logging in native SDKs where available. */ debug?: boolean;}MuxPlayerEvents
Sección titulada “MuxPlayerEvents”export interface MuxPlayerEvents { /** * Fired when the underlying player is ready to begin playback. */ ready: { playerName?: string }; /** * Fired when playback starts or resumes. */ play: void; /** * Fired when playback pauses. */ pause: void; /** * Fired when playback ends. */ ended: void; /** * Fired when an unrecoverable error occurs. */ error: { message: string }; /** * Fired when the fullscreen player is closed. */ playerDismissed: void;
/** * Get the native Capacitor plugin version * * @returns {Promise<{ id: string }>} an Promise with version for this device * @throws An error if the something went wrong */ getPluginVersion(): Promise<{ version: string }>;}Fuente de verdad
Sección titulada “Fuente de verdad”Esta página se genera a partir del plugin src/definitions.ts. Vuelve a ejecutar el sync cuando el API público cambie en upstream.
Continúa desde Getting Started
Sección titulada “Continúa desde Primeros pasos”Si estás usando Primeros pasos para planificar las operaciones del dashboard y de API, conéctalo con Uso de @capgo/capacitor-mux-player para la capacidad nativa en Uso de @capgo/capacitor-mux-player, Resumen de API para los detalles de implementación en API Overview, Introducción para los detalles de implementación en la Introducción, Claves de API para los detalles de implementación en las claves de API, y Dispositivos para el detalle de implementación en Devices.