This sample demonstrates how to integrate Dynamsoft Barcode Reader JavaScript SDK into an iOS WKWebView application using the Foundational API for maximum flexibility and customization.
Camera permission is declared in Info.plist:
<key>NSCameraUsageDescription</key>
<string>Decoding barcodes from video needs to access your camera.</string>The HTML file (decodeBarcodeInVideo.html) demonstrates:
CameraEnhancer: Controls camera operations (open, close, resolution)CameraView: Manages the UI layer for camera previewCaptureVisionRouter: Routes captured frames to the barcode reader- Result Callbacks: Custom handling of decoded barcode results
Example code structure:
// Create camera view and enhancer
const cameraView = await Dynamsoft.DCE.CameraView.createInstance();
const cameraEnhancer = await Dynamsoft.DCE.CameraEnhancer.createInstance(cameraView);
// Create capture vision router
const cvRouter = await Dynamsoft.CVR.CaptureVisionRouter.createInstance();
cvRouter.setInput(cameraEnhancer);
// Add result receiver
cvRouter.addResultReceiver({
onDecodedBarcodesReceived: (result) => {
// Handle decoded barcodes
}
});
// Start scanning
await cameraEnhancer.open();
await cvRouter.startCapturing("ReadSingleBarcode");-
Open the Project
cd ios open dbrjswebview.xcodeproj -
Configure Signing
- Select your project in Xcode
- Go to Signing & Capabilities
- Select your development team
-
Build and Run
- Connect an iOS device (camera doesn't work in simulator for WebView)
- Select your device as the run destination
- Click Run (⌘R)
- Grant camera permission when prompted
-
Test the Scanner
- Point the camera at a barcode
- Decoded results will appear below the camera view
For complete API documentation:
This sample uses a Dynamsoft trial license. To use in production:
- Visit the Customer Portal to obtain a license
- Replace the license key in
decodeBarcodeInVideo.html:Dynamsoft.License.LicenseManager.initLicense("YOUR-LICENSE-KEY");
Camera not opening:
- Ensure camera permission is granted in device settings
- Check iOS version (14.5+ required for camera in WKWebView)
- Verify you're testing on a physical device (not simulator)
WKWebView blank screen:
- Enable JavaScript in WKWebView configuration
- Check Safari Developer Console for JavaScript errors
- Enable Web Inspector: Settings → Safari → Advanced → Web Inspector
Permission denied:
- Verify
NSCameraUsageDescriptionis set inInfo.plist - Reset app permissions: Settings → Privacy → Camera
Need help? Contact Dynamsoft support:
- 📧 Email: support@dynamsoft.com
- 💬 Online: Contact Form
- 📚 Documentation: Dynamsoft Barcode Reader Docs
- Android WebView (Foundational API) - Android version of this sample
- iOS WKWebView (RTU API) - Simplified one-line integration
- Capacitor Sample - Cross-platform hybrid framework approach