Mobile Web Capture - Angular, React, and Vue

These samples demonstrate how to use the MobileWebCapture API from the Dynamsoft Mobile Web Capture SDK in Angular, React (with hooks), and Vue apps to scan, organize, and export multi-page documents with a camera. The samples live in the repository under samples/frameworks/:

• Angular
• React
• Vue

Note

Please contact us for any inquiries about currently unsupported frameworks.

Features

• Easy integration with pre-built UI
• Captures and auto-corrects a document from the camera
• Displays the corrected document image
• Mobile-optimized capture interface
• Angular: Renders MobileWebCapture inside an Angular component (Angular CLI stack)
• React: Renders MobileWebCapture inside a React component
• Vue: Renders MobileWebCapture inside a Vue component

Quick Start

Warning

Mobile Web Capture requires a valid license key to operate. Please see the licensing documentation to sign up for a free trial or a full license.

Note

MDS and MWC share the same license keys. If you already have an MDS license, you can use it for MWC, and vice versa.

1. Install Dependencies

Navigate to the root directory of one of the framework samples:

npm install

2. Serve the Application

npm run dev

Then open the URL presented in the console to view the sample app. Replace "YOUR_LICENSE_KEY_HERE" in the component source with your license key.

3. Build for Production

npm run build

You can preview the production build for React and Vue by additionally running:

npm run preview

User Guide

Read the official documentation to learn how to use and configure Mobile Web Capture:

• general user guide
• customization guide
• API reference

Support

If you have any questions, feel free to contact Dynamsoft Support.