A Vue component to scan MRZ on passports, visa cards, etc. It is based on Dynamsoft Label Recognizer.

Online demo

npm install vue-mrz-scanner

1. Import the library along with its css:

   import MRZScanner from 'vue-mrz-scanner';
   import '../node_modules/vue-mrz-scanner/dist/style.css';

2. Use the component in template:

   <MRZScanner 
     license="DLS2eyJoYW5kc2hha2VDb2RlIjoiMjAwMDAxLTE2NDk4Mjk3OTI2MzUiLCJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSIsInNlc3Npb25QYXNzd29yZCI6IndTcGR6Vm05WDJrcEQ5YUoifQ=="
     :scanning="true"
     @scanned="(results)=>console.log(results)"
   >
   </MRZScanner>

You need to pass a license for Dynamsoft Label Recognizer. You can apply for one here. A one-day trial license will be used by default if you do not specify one.