Comenzar

1. Instalar el Plugin

   npm

   npm i @Capgo/Capacitor-media-session

   pnpm

   pnpm add @Capgo/Capacitor-media-session

   yarn

   yarn add @Capgo/Capacitor-media-session

   bun

   bun add @Capgo/Capacitor-media-session

2. Sincronizar plataformas

   npm

   npx cap sync

   pnpm

   pnpm cap sync

   yarn

   yarn cap sync

   bun

   bunx cap sync

ℹ️ La API de Media Session está disponible en Android (navegadores basados en Chrome, WebView) y muchos navegadores de escritorio. En plataformas no compatibles, las llamadas se resuelven sin tener efecto, por lo que protege tu interfaz de usuario en consecuencia.

Publicar metadatos

import { MediaSession } from '@capgo/capacitor-media-session';

await MediaSession.setMetadata({
  title: 'Weekly Tech Podcast',
  artist: 'Capgo Studio',
  album: 'Season 2',
  artwork: [
    { src: 'https://cdn.example.com/covers/s02e05-512.png', sizes: '512x512', type: 'image/.png' },
  ],
});

Actualizar el estado de reproducción

await MediaSession.setPlaybackState({ playbackState: 'playing' });

// Pausar más tarde si es necesario
await MediaSession.setPlaybackState({ playbackState: 'paused' });

Manejar acciones multimedia

const pauseHandler = async () => {
  player.pause();
  await MediaSession.setPlaybackState({ playbackState: 'paused' });
};

await MediaSession.setActionHandler({ action: 'pause' }, pauseHandler);
await MediaSession.setActionHandler({ action: 'play' }, async () => {
  await player.play();
  await MediaSession.setPlaybackState({ playbackState: 'playing' });
});

// Eliminar un manejador cuando descartes el reproductor
await MediaSession.setActionHandler({ action: 'pause' }, null);

Mantener la posición sincronizada

const updatePosition = async () => {
  await MediaSession.setPositionState({
    duration: player.duration,
    position: player.currentTime,
    playbackRate: player.playbackRate,
  });
};

player.ontimeupdate = updatePosition;
player.onratechange = updatePosition;

Recomendaciones

• Actualiza los metadatos cuando cambie la pista para que las notificaciones y los altavoces inteligentes se mantengan actualizados.
• Limita las actualizaciones de posición (por ejemplo, cada 250 ms) para evitar saturar la capa nativa.
• Siempre elimina los manejadores de acciones al desmontar una instancia del reproductor para evitar fugas accidentales.