Close Menu

cordova-plugin-media-capture

About cordova-plugin-media-capture

The cordova-plugin-media-capture plugin provides access to the device’s audio, image, and video capturing capabilities. It allows users to capture and save multimedia files using their mobile device’s camera and microphone.

Installation

To install the cordova-plugin-media-capture in your Cordova project, use the following command:

cordova plugin add cordova-plugin-media-capture

Supported Platforms

This plugin supports the following platforms:

  • Android
  • iOS

Usage

To use the cordova-plugin-media-capture in your Cordova project, follow the steps below:

  1. Create a new Cordova project, if you haven’t already.
  2. Add the cordova-plugin-media-capture plugin using the installation command mentioned above.
  3. Include the MediaCapture plugin JavaScript file by adding the following script tag to your HTML:

<script src="cordova.js"></script>

Methods

The cordova-plugin-media-capture provides the following methods for capturing multimedia files:

captureAudio

Use the captureAudio method to capture audio from the device’s microphone. It takes an optional configuration object with parameters like duration and limit.

Parameters

  1. onSuccess (Function): The success callback function that gets called when the audio capture is successful.
  2. onError (Function): The error callback function that gets called when the audio capture encounters an error.
  3. options (Object): An optional configuration object with the following parameters:
    • limit (Number): The maximum number of audio files to capture.
    • duration (Number): The maximum duration of each captured audio file, in seconds.

Example

function captureAudioSuccess(mediaFiles) {
  console.log(mediaFiles);
}

function captureAudioError(error) {
  console.error(error);
}

navigator.device.capture.captureAudio(captureAudioSuccess, captureAudioError, { limit: 1, duration: 10 });

captureImage

Use the captureImage method to capture images from the device’s camera. It takes an optional configuration object with parameters like quality and limit.

Parameters

  1. onSuccess (Function): The success callback function that gets called when the image capture is successful.
  2. onError (Function): The error callback function that gets called when the image capture encounters an error.
  3. options (Object): An optional configuration object with the following parameters:
    • limit (Number): The maximum number of images to capture.
    • quality (Number): The quality of the captured images, ranging from 0 to 100.

Example

function captureImageSuccess(mediaFiles) {
  console.log(mediaFiles);
}

function captureImageError(error) {
  console.error(error);
}

navigator.device.capture.captureImage(captureImageSuccess, captureImageError, { limit: 1, quality: 80 });

captureVideo

Use the captureVideo method to capture videos from the device’s camera. It takes an optional configuration object with parameters like duration and limit.

Parameters

  1. onSuccess (Function): The success callback function that gets called when the video capture is successful.
  2. onError (Function): The error callback function that gets called when the video capture encounters an error.
  3. options (Object): An optional configuration object with the following parameters:
    • limit (Number): The maximum number of videos to capture.
    • duration (Number): The maximum duration of each captured video file, in seconds.

Example

function captureVideoSuccess(mediaFiles) {
  console.log(mediaFiles);
}

function captureVideoError(error) {
  console.error(error);
}

navigator.device.capture.captureVideo(captureVideoSuccess, captureVideoError, { limit: 1, duration: 15 });

Example

Below is an example of how to use the cordova-plugin-media-capture to capture both audio and images:

function captureMediaSuccess(mediaFiles) {
  console.log(mediaFiles);
}

function captureMediaError(error) {
  console.error(error);
}

// Capture audio
navigator.device.capture.captureAudio(captureMediaSuccess, captureMediaError, { limit: 2, duration: 10 });

// Capture images
navigator.device.capture.captureImage(captureMediaSuccess, captureMediaError, { limit: 3, quality: 70 });

Remember to handle the success and error callbacks appropriately in your code.

Conclusion

The cordova-plugin-media-capture is a powerful plugin that enables you to capture audio, images, and videos in your Cordova projects. With its easy-to-use methods and configuration options, you can create engaging multimedia experiences for your users.