Announcing the Capacitor Audio Recorder Plugin

Today we are excited to announce our brand new Capacitor Audio Recorder plugin. This plugin enables recording audio in your Capacitor app and provides cross-platform support for Android, iOS and web. It's available to all Capawesome Insiders.

Let's take a quick look at the API and how you can use the plugin to record audio.

Installation

See Getting started with Insiders and follow the instructions to install the plugin.

After that, follow the platform-specific instructions in the sections Android and iOS.

Usage

The plugin is very easy to use. Let's take a look at the basic usage of the plugin.

Start recording

You can immediately start recording audio with the startRecording() method:

import { AudioRecorder } from "@capawesome-team/capacitor-audio-recorder";

const startRecording = async () => {
  await AudioRecorder.startRecording();
};

There are no additional parameters required.

Pause recording

You can pause the recording at any time with the pauseRecording() method:

import { AudioRecorder } from "@capawesome-team/capacitor-audio-recorder";

const pauseRecording = async () => {
  await AudioRecorder.pauseRecording();
};

Resume recording

After pausing the recording, you can resume it with the resumeRecording() method:

import { AudioRecorder } from "@capawesome-team/capacitor-audio-recorder";

const resumeRecording = async () => {
  await AudioRecorder.resumeRecording();
};

Stop recording

Finally, you can stop the recording with the stopRecording() method:

import { AudioRecorder } from '@capawesome-team/capacitor-audio-recorder';
import { NativeAudio } from '@capacitor-community/native-audio';

const stopRecording = async () => {
  // Stop recording and get the audio blob or URI
  const { blob, uri } = await AudioRecorder.stopRecording();
  // Play the audio
  if (blob) {
    // Only available on Web
    const audio = new Audio();
    audio.src = URL.createObjectURL(blob);
    audio.play();
  } else if (uri) {
    // Only available on Android and iOS
    await NativeAudio.preload({
      assetId: 'recording',
      assetPath: uri,
      isUrl: true,
    });
    await NativeAudio.play({ assetId: 'recording' });
  }
};

This method returns a blob or uri depending on the platform. The blob is only available on web, while the uri is only available on Android and iOS. You can then upload the audio file to your server or play it back in your app.

Get recording status

Additionally, you can check the recording status at any time with the getRecordingStatus() method:

import { AudioRecorder } from "@capawesome-team/capacitor-audio-recorder";

const getRecordingStatus = async () => {
  const { status } = await AudioRecorder.getRecordingStatus();
  console.log("Recording status:", status);
};

This method returns the current recording status, which can be either INACTIVE, RECORDING or PAUSED.

Conclusion

We hope you are as excited as we are about the new Capacitor Audio Recorder plugin. Be sure to check out the API Reference to see what else you can do with this plugin. If you are missing any features, just create a feature request in the GitHub repository. Make sure you follow us on X so you don't miss any future updates.