Skip to main content

cordova-plugin-camera-preview Alternative for Capacitor

cordova-plugin-camera-preview alternative for Capacitor: replace Cordova camera preview callbacks with @capgo/camera-preview, live overlay UI, capture, and video.

Illustration of migrating a Cordova app to Capacitor, used for a camera preview plugin guide

If you need a cordova-plugin-camera-preview alternative in a Capacitor app, use @capgo/camera-preview. The Capgo plugin is explicitly based on cordova-plugin-camera-preview and keeps the same idea: a native camera stream behind or in front of your HTML so you can build custom scanners, AR-style overlays, and inline capture screens. This guide covers maintenance context, install steps, a short example, and an API map from Cordova callbacks to Capacitor promises.

Why migrate off the Cordova plugin

cordova-plugin-camera-preview still ships on npm. The latest version is 0.14.0 (npm modified 12 July 2025). The community GitHub repo received commits in 2026, and the README states releases are still updated.

For Capacitor teams the blocker is the runtime model:

  • Methods such as CameraPreview.startCamera use Cordova success and error callbacks, not promises.
  • The plugin installs through cordova plugin add, not @capacitor/cli sync.
  • Capacitor 8 projects avoid the Cordova compatibility layer when they can, because it complicates permissions, debugging, and store review (CallKit and microphone edge cases on iOS).

@capgo/camera-preview lists the same feature set in its README (live preview, photo capture, video, effects, tap to focus, toBack overlays) and adds Capacitor-only capabilities such as barcode scanning, permission helpers, and optional integration with @capgo/capacitor-uploader when storeToFile saves captures to disk.

Capgo maintains the plugin for current Capacitor major versions (v8.x for Capacitor 8 per the README compatibility table). Issues and fixes follow the Capgo open source workflow described in the repository.

Install

bun add @capgo/camera-preview
bunx cap sync

Android: in android/app/src/main/AndroidManifest.xml add at minimum:

<uses-permission android:name="android.permission.CAMERA" />

Add RECORD_AUDIO only when disableAudio is false. Add storage or location permissions only when you enable gallery save or EXIF location options documented in the README.

iOS: in ios/App/App/Info.plist set NSCameraUsageDescription. Add NSMicrophoneUsageDescription when recording video with audio, or set disableAudio: true to skip the microphone prompt.

Web: import the web implementation once (for example in your Ionic entry module) so Capacitor registers the plugin: import '@capgo/camera-preview'.

Rebuild native binaries after permission or CallKit configuration changes. JavaScript-only tweaks can ship with Capgo live updates afterward.

Usage example

import { CameraPreview } from '@capgo/camera-preview';

export async function openScannerOverlay() {
  await CameraPreview.start({
    position: 'rear',
    toBack: true,
    width: window.innerWidth,
    height: window.innerHeight,
    disableAudio: true,
    barcodeScanner: true,
  });

  const handle = await CameraPreview.addListener('barcodeScanned', async (event) => {
    console.log(event.value);
    await CameraPreview.stop();
    await handle.remove();
  });
}

When toBack is true, keep the WebView background transparent so touches reach your HTML controls while the camera sits underneath.

Migrating from Cordova to Capacitor

Unregister Cordova CameraPreview globals and import from @capgo/camera-preview. Replace callback arguments with await and use addListener for events such as barcode scans.

API mapping table

cordova-plugin-camera-preview @capgo/camera-preview
CameraPreview.startCamera(options, success, error) CameraPreview.start(options)
CameraPreview.stopCamera(success, error) CameraPreview.stop()
CameraPreview.switchCamera(success, error) CameraPreview.flip()
CameraPreview.takePicture(options, success, error) CameraPreview.capture(options)
CameraPreview.takeSnapshot(options, success, error) CameraPreview.captureSample(options)
CameraPreview.show() / hide() Use stop() and start() or opacity via setOpacity()
CameraPreview.startRecordVideo(options, success, error) CameraPreview.startRecordVideo(options)
CameraPreview.stopRecordVideo(success, error) CameraPreview.stopRecordVideo()
CameraPreview.setZoom(zoom, ...) CameraPreview.setZoom({ level })
CameraPreview.getZoom(cb, ...) CameraPreview.getZoom()
CameraPreview.setFlashMode(mode, ...) CameraPreview.setFlashMode({ mode })
CameraPreview.getSupportedFlashModes(cb, ...) CameraPreview.getSupportedFlashModes()
CameraPreview.tapToFocus(x, y, ...) CameraPreview.setFocus({ x, y })
CameraPreview.setColorEffect(effect, ...) Check README for effect helpers or post-process frame
CameraPreview.setPreviewSize(dimensions, ...) Pass updated width / height in start() options or layout APIs
options.storeToFile storeToFile: true on start() / capture() (returns file path)
options.toBack toBack: true plus transparent WebView CSS
options.camera BACK / FRONT position: 'rear' or 'front'

Cordova option names such as tapPhoto map to Capgo capture settings documented in the README. Prefer the TypeScript CameraPreviewOptions interface in @capgo/camera-preview when you port advanced exposure or white balance calls.

iOS CallKit note

The Capgo README documents optional iosCallKit in capacitor.config. It defaults to false so camera-only apps avoid App Store CallKit review friction in regions where CallKit apps are restricted. Enable it only when you need phone-call-aware microphone recovery.

For the wider Cordova move, see migrating Cordova to Capacitor. Cloud builds after native plugin changes: Capgo Build.

Live updates for Capacitor apps

When a web-layer bug is live, ship the fix through Capgo instead of waiting days for app store approval. Users get the update in the background while native changes stay in the normal review path.

Latest from our Blog

Capgo gives you the best insights you need to create a truly professional mobile app.