メインコンテンツへスキップ

スタートガイド

GitHub

AIアシストによるセットアップでプラグインをインストールできます。以下のコマンドを使用して、お使いのAIツールに Capgo のスキルを追加してください:

ターミナル
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

次に、以下のプロンプトを使用します:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-native-audio` plugin in my project.

手動セットアップを希望する場合は、以下のコマンドを実行してプラグインをインストールし、下記のプラットフォーム別の手順に従ってください:

ターミナル
bun add @capgo/capacitor-native-audio
bunx cap sync
import { NativeAudio } from '@capgo/capacitor-native-audio';

一度の設定で、クリップのプリロードからUIフィードバックの再生まで可能です。 playOnce() 「再生して終わり」のサウンドを簡単に鳴らせます。

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.configure({ focus: true, showNotification: false });
await NativeAudio.playOnce({ assetPath: 'public/sounds/tap.mp3', volume: 0.8 });
await NativeAudio.preload({
assetId: 'episode-1',
assetPath: 'https://cdn.example.com/episode.m3u8',
isUrl: true,
});
await NativeAudio.play({ assetId: 'episode-1' });
await NativeAudio.addListener('currentTime', ({ assetId, time }) => updateScrubber(assetId, time));

例: オーディオセッションの解放

「例:オーディオセッションの解放」セクション

他のプラグインがオーディオの排他的制御を必要とする場合は、再生を停止して以下を呼び出してください: deinitPlugin() これにより、前のセッションが復元されます。

await NativeAudio.stop({ assetId: 'episode-1' });
await NativeAudio.deinitPlugin();
  • Now Playing と mixing の違い: showNotification: true iOS では、バックグラウンド再生を中断する再生カテゴリに切り替わります。
  • Android バックグラウンド: 有効化するには backgroundPlayback README に記載されている必要なフォアグラウンドサービスと権限の設定を完了してから行ってください。
  • Web版のリスナー: Webでは再生状態のリスナーイベントが発行されません。これらに依存するUIにはガード処理を入れてください。

オーディオプレイヤーの設定

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.configure({
focus: false,
background: false,
ignoreSilent: false,
showNotification: false,
backgroundPlayback: false,
});

オーディオファイルのロード

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.preload({
assetPath: 'path/to/file',
assetId: 'asset-id-123',
});

オーディオファイルを一度だけ再生(自動クリーンアップ付き)

通知音やUIフィードバックなど、手動での状態管理を必要としない 短時間のオーディオ再生に特化したメソッドです。

主な機能:

  • Fire-and-forget: 事前のプリロード、再生、停止、アンロードの手間が不要
  • 自動クリーンアップ: 再生完了後にアセットを自動的にアンロード
  • オプションのファイル削除: 再生後にローカルファイルを削除可能(一時ファイルに便利)
  • assetIdを返却: 必要に応じて再生制御(一時停止、停止など)も可能

ユースケース:

  • 通知音
  • UI効果音(ボタンクリック、アラート)
  • 一度だけ再生される短いオーディオクリップ
  • 削除が必要な一時的なオーディオファイル

通常の play() との比較:

  • play(): 手動でのpreload、play、unloadが必要
  • playOnce(): 1回の呼び出しですべて自動的に処理
import { NativeAudio } from '@capgo/capacitor-native-audio';
// Simple one-shot playback
await NativeAudio.playOnce({ assetPath: 'audio/notification.mp3' });
// Play and delete the file after completion
await NativeAudio.playOnce({
assetPath: 'file:///path/to/temp/audio.mp3',
isUrl: true,
deleteAfterPlay: true
});
// Get the assetId to control playback
const { assetId } = await NativeAudio.playOnce({
assetPath: 'audio/long-track.mp3',
autoPlay: true
});
// Later, you can stop it manually if needed
await NativeAudio.stop({ assetId });

オーディオファイルがpreload済みか確認する

import { NativeAudio } from '@capgo/capacitor-native-audio';
const result = await NativeAudio.isPreloaded({
assetPath: 'path/to/file',
assetId: 'asset-id-123',
});
console.log(result);

オーディオファイルを再生する

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.play({ assetId: 'asset-id-123' });

オーディオファイルを一時停止

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.pause({ assetId: 'asset-id-123' });

オーディオファイルの再生を再開

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.resume({ assetId: 'asset-id-123' });

オーディオファイルを停止

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.loop({ assetId: 'asset-id-123' });

オーディオファイルを停止

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.stop({ assetId: 'asset-id-123' });

オーディオファイルをアンロードする

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.unload({ assetId: 'asset-id-123' });

オーディオファイルの音量を設定する

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.setVolume({
assetId: 'asset-id-123',
volume: 0.5,
});

オーディオファイルの再生速度を設定する

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.setRate({
assetId: 'asset-id-123',
rate: 1,
});

オーディオファイルの再生位置を設定する

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.setCurrentTime({
assetId: 'asset-id-123',
time: 10,
});

オーディオファイルの現在再生時間を取得する

import { NativeAudio } from '@capgo/capacitor-native-audio';
const result = await NativeAudio.getCurrentTime({ assetId: 'asset-id-123' });
console.log(result);

オーディオファイルの再生時間を秒単位で取得する

import { NativeAudio } from '@capgo/capacitor-native-audio';
const result = await NativeAudio.getDuration({ assetId: 'asset-id-123' });
console.log(result);

オーディオファイルが再生中かどうかを確認する

import { NativeAudio } from '@capgo/capacitor-native-audio';
const result = await NativeAudio.isPlaying({ assetId: 'asset-id-123' });
console.log(result);

リモートオーディオファイルのキャッシュをクリアする

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.clearCache();

デバッグモードのログ設定

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.setDebugMode({ enabled: true });

プラグインを初期化解除し、元のオーディオセッション設定を復元します このメソッドは再生中のすべてのオーディオを停止し、プラグインが行ったオーディオセッションの変更をすべて元に戻します 他のオーディオプラグインとの互換性を確保する必要がある場合に使用します

import { NativeAudio } from '@capgo/capacitor-native-audio';
await NativeAudio.deinitPlugin();
export interface ConfigureOptions {
/**
* focus the audio with Audio Focus
*/
focus?: boolean;
/**
* Play the audio in the background
*/
background?: boolean;
/**
* Ignore silent mode, works only on iOS setting this will nuke other audio apps
*/
ignoreSilent?: boolean;
/**
* Show audio playback in the notification center (iOS and Android)
* When enabled, displays audio metadata (title, artist, album, artwork) in the system notification
* and Control Center (iOS) or lock screen.
*
* **Important iOS Behavior:**
* Enabling this option changes the audio session category to `.playback` with `.default` mode,
* which means your app's audio will **interrupt** other apps' audio (like background music from
* Spotify, Apple Music, etc.) instead of mixing with it. This is required for the Now Playing
* info to appear in Control Center and on the lock screen.
*
* **Trade-offs:**
* - `showNotification: true` → Shows Now Playing controls, but interrupts other audio
* - `showNotification: false` → Audio mixes with other apps, but no Now Playing controls
*
* Use this when your app is the primary audio source (music players, podcast apps, etc.).
* Disable this for secondary audio like sound effects or notification sounds where mixing
* with background music is preferred.
*
* @see https://github.com/Cap-go/capacitor-native-audio/issues/202
*/
showNotification?: boolean;
/**
* Enable background audio playback (Android only)
*
* When enabled, audio will continue playing when the app is backgrounded or the screen is locked.
* The plugin will skip the automatic pause/resume logic that normally occurs when the app
* enters the background or returns to the foreground.
*
* **Important Android Requirements:**
* To use background playback on Android, your app must:
* 1. Declare the required permissions in `AndroidManifest.xml`:
* - `<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />`
* - `<uses-permission android:name="android.permission.FOREGROUND_SERVICE_MEDIA_PLAYBACK" />`
* - `<uses-permission android:name="android.permission.WAKE_LOCK" />`
* 2. Start a Foreground Service with a media-style notification before backgrounding
* (the plugin does not automatically create or manage the foreground service)
* 3. Use `showNotification: true` to display playback controls in the notification
*
* **Usage Example:**
* ```typescript
* await NativeAudio.configure({
* backgroundPlayback: true,
* showNotification: true
* });
* // Start your foreground service here
* // Then preload and play audio as normal
* ```
*
* @default false
* @platform Android
* @since 8.2.0
*/
backgroundPlayback?: boolean;
}
export interface PreloadOptions {
/**
* Path to the audio file, relative path of the file, absolute url (file://) or remote url (https://)
* Supported formats:
* - MP3, WAV (all platforms)
* - M3U8/HLS streams (iOS and Android)
*/
assetPath: string;
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Volume of the audio, between 0.1 and 1.0
*/
volume?: number;
/**
* Audio channel number, default is 1
*/
audioChannelNum?: number;
/**
* Is the audio file a URL, pass true if assetPath is a `file://` url
* or a streaming URL (m3u8)
*/
isUrl?: boolean;
/**
* Metadata to display in the notification center when audio is playing.
* Only used when `showNotification: true` is set in `configure()`.
*
* See {@link ConfigureOptions.showNotification} for important details about
* how this affects audio mixing behavior on iOS.
*
* @see NotificationMetadata
*/
notificationMetadata?: NotificationMetadata;
/**
* Custom HTTP headers to include when fetching remote audio files.
* Only used when isUrl is true and assetPath is a remote URL (http/https).
* Example: { 'x-api-key': 'abc123', 'Authorization': 'Bearer token' }
*
* @since 7.10.0
*/
headers?: Record<string, string>;
}
export interface PlayOnceOptions {
/**
* Path to the audio file, relative path of the file, absolute url (file://) or remote url (https://)
* Supported formats:
* - MP3, WAV (all platforms)
* - M3U8/HLS streams (iOS and Android)
*/
assetPath: string;
/**
* Volume of the audio, between 0.1 and 1.0
* @default 1.0
*/
volume?: number;
/**
* Is the audio file a URL, pass true if assetPath is a `file://` url
* or a streaming URL (m3u8)
* @default false
*/
isUrl?: boolean;
/**
* Automatically start playback after loading
* @default true
*/
autoPlay?: boolean;
/**
* Delete the audio file from disk after playback completes
* Only works for local files (file:// URLs), ignored for remote URLs
* @default false
* @since 7.11.0
*/
deleteAfterPlay?: boolean;
/**
* Metadata to display in the notification center when audio is playing.
* Only used when `showNotification: true` is set in `configure()`.
*
* See {@link ConfigureOptions.showNotification} for important details about
* how this affects audio mixing behavior on iOS.
*
* @see NotificationMetadata
* @since 7.10.0
*/
notificationMetadata?: NotificationMetadata;
/**
* Custom HTTP headers to include when fetching remote audio files.
* Only used when isUrl is true and assetPath is a remote URL (http/https).
* Example: { 'x-api-key': 'abc123', 'Authorization': 'Bearer token' }
*
* @since 7.10.0
*/
headers?: Record<string, string>;
}
export interface PlayOnceResult {
/**
* The internally generated asset ID for this playback
* Can be used to control playback (pause, stop, etc.) before completion
*/
assetId: string;
}
export interface AssetPlayOptions {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Time to start playing the audio, in seconds
*/
time?: number;
/**
* Delay to start playing the audio, in seconds
*/
delay?: number;
/**
* Volume of the audio, between 0.1 and 1.0
*/
volume?: number;
/**
* Whether to fade in the audio
*/
fadeIn?: boolean;
/**
* Whether to fade out the audio
*/
fadeOut?: boolean;
/**
* Fade in duration in seconds.
* Only used if fadeIn is true.
* Default is 1s.
*/
fadeInDuration?: number;
/**
* Fade out duration in seconds.
* Only used if fadeOut is true.
* Default is 1s.
*/
fadeOutDuration?: number;
/**
* Time in seconds from the start of the audio to start fading out.
* Only used if fadeOut is true.
* Default is fadeOutDuration before end of audio.
*/
fadeOutStartTime?: number;
}
export interface AssetPauseOptions {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Whether to fade out the audio before pausing
*/
fadeOut?: boolean;
/**
* Fade out duration in seconds.
* Default is 1s.
*/
fadeOutDuration?: number;
}
export interface AssetResumeOptions {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Whether to fade in the audio during resume
*/
fadeIn?: boolean;
/**
* Fade in duration in seconds.
* Default is 1s.
*/
fadeInDuration?: number;
}
export interface Assets {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
}
export interface AssetStopOptions {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Whether to fade out the audio before stopping
*/
fadeOut?: boolean;
/**
* Fade out duration in seconds.
* Default is 1s.
*/
fadeOutDuration?: number;
}
export interface AssetVolume {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Volume of the audio, between 0.1 and 1.0
*/
volume: number;
/**
* Time over which to fade to the target volume, in seconds. Default is 0s (immediate).
*/
duration?: number;
}
export interface AssetRate {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Rate of the audio, between 0.1 and 1.0
*/
rate: number;
}
export interface AssetSetTime {
/**
* Asset Id, unique identifier of the file
*/
assetId: string;
/**
* Time to set the audio, in seconds
*/
time: number;
}

このページはプラグインの src/definitions.tsから生成されています。upstream で公開 API が変更されたら、再度 sync を実行してください。

Getting Startedの続きを進める

「Getting Started からの続き」セクション

使用している場合 スタートガイド ネイティブメディアとインターフェースの挙動を計画するには、次と連携させてください @capgo/capacitor-native-audio の使用方法 @capgo/capacitor-native-audio でネイティブ機能を使用する場合、 @capgo/capacitor-live-activities の使用 @capgo/capacitor-live-activities の使用におけるネイティブ機能については、 @capgo/capacitor-live-activities @capgo/capacitor-live-activities の実装の詳細については、 @capgo/capacitor-video-playerの使用方法 @capgo/capacitor-video-player を使用する際のネイティブ機能については、 @capgo/capacitor-video-player @capgo/capacitor-video-player. の実装の詳細については