Library: continuous scan

[lenny76]

hi
following your example
I've succeded in scan a qrcode in html5 webpage.
after the scan successful result, the video camera scan process stops.

how can I make the scan process continuous?

thanks

[odahcam]

Take a look on the BrowserCodeReader available on ngx-scanner repo, I've implmented it there, it should work with common JS, you just gonna need to use RxJS as a dependency, since I used it there. It's a project of mine to implement a good BrowserCodeReader on it's own package depending on the core here to do such a functionality.

[lenny76]

I'm not so good with coding,
but I've tried this.

created a function to call.
after a code scan valid, I recall the function.

function attivascan(){

codeReader.decodeFromInputVideoDevice(undefined, 'video')
    .then(result => {
        verifycode(result.text);
    })
    .catch(err => console.error(err));
}

function verifycode(qrcode){
   attivascan();
}

it works. just a glitch. the screen flashes when the function recall the decodeFromInputVideoDevice

better than nothing :)

thanks

[odahcam]

That's good, it's gonna work for now. Sorry about the unfinished things, we're trying to get to v1.0.0 ASAP and some nice folks are helping a lot, but there's just too many things to code.

I will close this for now, but soon we gonna have news.

[Meekohi]

Solution is to recursively call codeReader.decodeOnceWithDelay(scanOk, scanFail); instead of doing the whole decodeFromInputVideo setup.

[luanribeirosv]

@Meekohi can you show me how the code would look?

[Meekohi]

Something like:

function scanOk(result) {
  console.log(result)
  codeReader.decodeOnceWithDelay(scanOk, scanFail)
}
function scanFail(err) {
  alert(err)
}
codeReader.getVideoInputDevices()
    .then((videoInputDevices) => {
      const deviceId = videoInputDevices[0].deviceId
      codeReader.decodeFromInputVideoDevice(deviceId, 'video').then(scanOk).catch(scanFail)
    })

[matteopey]

My typescript version of the solution of Meekohi is this one.

// I had to extend the class to allow 'decodeOnceWithDelay' to be called from outside it, because is protected.
class MyScanner extends BrowserQRCodeReader {
  // Wrapper that make the method public
  public decodeOnceWithDelay(resolve: (result: Result) => any, reject: (error: any) => any): void {
    super.decodeOnceWithDelay(resolve, reject);
  }
}

@Injectable()
export class ScannerService {
  @Output() scannedData = new EventEmitter<string>();

  constructor() { }

  private codeReader: MyScanner = new MyScanner();

  public start() {
    this.codeReader
      .decodeFromInputVideoDevice(undefined, undefined)
        .then(this.scanOk.bind(this))
        .catch(this.scanErr.bind(this));
  }

  public stop() {
    this.codeReader.reset();
  }

  private scanOk(result: Result) {
    console.log(result.getText());
    this.scannedData.emit(result.getText());

    this.codeReader.decodeOnceWithDelay(this.scanOk.bind(this), this.scanErr.bind(this));
  }

  private scanErr(error) {
    console.log(error);
  }
}

[odahcam]

If you're using Angular, I recommend you using https://github.com/zxing-js/ngx-scanner which already has continuous scan functionality. :)

[mathiasfc]

Something like:

function scanOk(result) {
  console.log(result)
  codeReader.decodeOnceWithDelay(scanOk, scanFail)
}
function scanFail(err) {
  alert(err)
}
codeReader.getVideoInputDevices()
    .then((videoInputDevices) => {
      const deviceId = videoInputDevices[0].deviceId
      codeReader.decodeFromInputVideoDevice(deviceId, 'video').then(scanOk).catch(scanFail)
    })

@Meekohi my codeReader doesn't have decodeOnceWithDelay function, can you help me understand where I'm going wrong? I'm using:

const codeReader = new BrowserMultiFormatReader();

I'm trying to implement continuous scan without screen flashes.

[odahcam]

You can use decodeFromInputVideoDeviceContinuously:

https://github.com/zxing-js/library/blob/2fddacaaa626b34908019ed5e2e3e736e60a2aaa/src/browser/BrowserCodeReader.ts#L231

This functionality is already implemented in the latest version (0.14).