Langsung ke konten utama

Sesi Media plugin Capacitor

Kontrol playback media dari lock screen dan notification center

Instal

bun add @capgo/capacitor-media-session bunx cap sync
npm, pnpm atau yarn
  • npm install @capgo/capacitor-media-session
  • pnpm add @capgo/capacitor-media-session
  • yarn add @capgo/capacitor-media-session

Panduan

Cara menggunakan Media Session di Capacitor

Tes di perangkat

Download aplikasi Capgo, lalu scan QR code.

QR preview plugin Media Session code

Menggunakan @capgo/capacitor-media-session

Plugin Capacitor untuk menampilkan kontrol media session pada perangkat.

Instal

bun add @capgo/capacitor-media-session
bunx cap sync

bunx cap sync menyalin code native plugin ke dalam proyek native Anda. Jalankan kembali setiap kali melakukan upgrade plugin.

Impor

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

Sekilas tentang API

Metode Deskripsi
setMetadata Mengatur metadata media yang sedang diputar.
setPlaybackState Memperbarui status playback dari media session.
setActionHandler Mendaftarkan handler untuk aksi media session.
setPositionState Memperbarui status posisi media session yang aktif.

Contoh

setMetadata()

Mengatur metadata media yang sedang diputar.

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

await MediaSession.setMetadata({ album: 'album' });

setPlaybackState()

Memperbarui status playback dari media session.

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

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

setActionHandler()

Mendaftarkan handler untuk aksi media session.

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

await MediaSession.setActionHandler({ action: 'play' }, (details) => {
  console.log(details);
});

setPositionState()

Memperbarui status posisi media session yang aktif.

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

await MediaSession.setPositionState({
  duration: 1000,
  playbackRate: 1,
  position: 10,
});

Referensi lengkap

Lanjutkan dari Menggunakan @capgo/capacitor-media-session

Jika Anda menggunakan Menggunakan @capgo/capacitor-media-session untuk merencanakan operasi dashboard dan API, hubungkan dengan @capgo/capacitor-media-session untuk detail implementasi di @capgo/capacitor-media-session, Panduan Memulai untuk detail implementasi di Getting Started, Ringkasan API untuk detail implementasi di API Overview, Pendahuluan untuk detail implementasi di Introduction, dan Kunci API untuk detail implementasi di API Keys.

FAQ

FAQ plugin Media Session

Bagaimana cara install plugin Media Session di aplikasi Capacitor?

Jalankan "bun add @capgo/capacitor-media-session" (atau "npm install @capgo/capacitor-media-session"), lalu jalankan "bunx cap sync" agar proyek iOS dan Android mendeteksi code native. Import dari "@capgo/capacitor-media-session" di dalam code aplikasi Anda.

Apakah @capgo/capacitor-media-session bisa digunakan dengan React, Vue, dan Angular?

Ya. Media Session adalah package Capacitor, jadi bisa digunakan dengan framework web apa pun yang berjalan di dalam Capacitor, termasuk Ionic, React, Vue, Angular, Svelte, dan JavaScript biasa.

Versi Capacitor mana yang didukung oleh @capgo/capacitor-media-session?

Plugin Capgo mengikuti versi mayor Capacitor: gunakan versi mayor plugin yang sesuai dengan versi mayor Capacitor Anda (contoh: plugin v8 dengan Capacitor 8). Tabel kompatibilitas di README GitHub mencantumkan versi yang masih di-maintain.

Apakah @capgo/capacitor-media-session gratis dan open source?

Ya. Source code code bersifat publik di GitHub pada https://github.com/Cap-go/capacitor-media-session/ dan package ini gratis untuk diinstall dari npm. Bug report dan pull request sangat kami terima.

Bisakah saya update code yang menggunakan Media Session tanpa review App Store?

Instalasi atau upgrade plugin akan mengubah native code, jadi butuh build store baru. Setelah itu, perubahan JavaScript, HTML, dan CSS yang memanggil plugin bisa langsung dikirim lewat live updates Capgo.

Deploy perubahan Media Session tanpa menunggu review aplikasi

Setelah plugin ada di build store Anda, live updates Capgo akan mengirim perubahan JavaScript, HTML, dan CSS ke pengguna dalam hitungan menit.

Mulai dengan Capgo