A Lightning web component can use a mobile device’s camera and mobile OS platform features to scan a barcode, such as a UPC symbol or QR code. When a barcode is successfully scanned, the data that was read from the barcode is returned to the Lightning web component that invoked it.
Scanning is performed locally on the mobile device, and doesn’t need a network connection. BarcodeScanner does require access to platform-specific APIs that are available only within compatible Salesforce mobile apps.
BarcodeScanner does not and cannot function when running in a web browser, whether running on a desktop or mobile device.
Important
BarcodeScanner provides to your component a string value of the data encoded in a scanned barcode. It doesn’t attempt to interpret or process the decoded value.
Barcode Scanning User Experience
Your component can deliver any user experience you desire, but there’s a common flow for any component that can scan a barcode.
To develop a Lightning component with barcode scanning features, use the BarcodeScanner API.
BarcodeScanner Example–Modern Scanning API
Here’s a complete example of a Lightning web component that uses BarcodeScanner to scan multiple barcodes simultaneously and process them in a batch after scanning is completed.
BarcodeScanner Example—Single Scan (Legacy)
Here’s a minimal but complete example of a Lightning web component that uses BarcodeScanner to recognize a barcode.
Scan Multiple Barcodes (Legacy)
To scan multiple barcodes in a single scanning session, use resumeCapture() to create a continuous scanning cycle that scans barcodes until the user clicks the Cancel button.
BarcodeScanner Example—Continuous Scanning (Legacy)
Here’s a minimal but complete example of a Lightning web component that uses BarcodeScanner to scan for and recognize multiple barcodes in a continuous cycle.
Create a Self-Service Kiosk Application
Use BarcodeScanner with a device’s front-facing camera to create applications suitable for use as an unattended self-service kiosk.
BarcodeScanner Example—Self-Service Kiosk (Legacy)
Here’s a complete example of a Lightning web component with BarcodeScanner that could serve as a self-service kiosk.
Customize the BarcodeScanner User Interface
BarcodeScanner provides a standard, minimal user interface that can be used out of the box. For applications and use cases where the standard user interface doesn’t provide enough information, or to customize for your company or brand, create a custom UI using HTML.
Compatibility and Requirements
BarcodeScanner is a JavaScript module that provides an API to Lightning web components to make mobile hardware and platform (operating system) features available in JavaScript. It requires access to device hardware and device platform APIs. This access is only available when BarcodeScanner runs within a compatible Salesforce mobile app. It does not and cannot function when running in a web browser, whether the browser runs on a desktop or mobile device.
Considerations and Limitations
Keep the following in mind when developing features that use the BarcodeScanner API.
See Also
j
