Barcode in LWC

Scan Barcode in LWC Natively

Around 7 years back I have written this post which shows how Barcode scan can be supported in Visualforce and in aura component with the help of an external javascript library quagga.

Salesforce recently released a new Barcode API which now supports barcode scanning natively on LWC for mobile devices. As it’s supported natively, we don’t need to worry about maintaining 3rd party Javascripts, Locker services, performance issues, etc.

At the time of writing this blog post, around 10 different types of barcodes are supported.

Below source code demonstrate how simple it is to use in LWC.

  • import lightning/mobileCapabilities
  • initiate scanner variable using method getBarcodeScanner()
  • set configuration suggesting which barcodes are supported
  • use begineCapture() method top launch mobile camera
  • read the result or handle error

Resources :

Posted

in

by


Related Posts

Comments

7 responses to “Scan Barcode in LWC Natively”

  1. Aditya Sharma Avatar

    Awesome demo of the latest feature.

  2. Boubacar Sow Avatar
    Boubacar Sow

    Wonderfull things. great !!
    Many thanks

  3. Mohit Avatar
    Mohit

    Can we scan QR code in lwc?

  4. Pratik Kumar Avatar
    Pratik Kumar

    Got an error stating, “Scanner not supported on this device” while using it on Salesforce1 app with a Community user.

    1. Archana Avatar
      Archana

      Hello Pratik . I also tried the same in saleforce one app , for some reason when I click on the button nothing is happening and its still . do we need to add anything else to the code other then this . Any suggestion on it ? Thank you in advance

  5. Pratik Kumar Avatar
    Pratik Kumar

    Tried this for Community user in browser. Didn’t work. this.myScanner.isAvailbale() is returning undefined

  6. anil Avatar
    anil

    can we deploy this code into HeroKu

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Discover more from Jitendra Zaa

Subscribe now to keep reading and get access to the full archive.

Continue Reading