ericblade / quagga2-reader-qr

Quagga2 sample external reader for QR codes
32 stars 10 forks source link

Support live steam #81

Closed hiroppy closed 3 years ago

hiroppy commented 3 years ago

Hi, I would like to ask can this qrcode reader work with live stream? Because I confirmed my repo using this reader but when I use inputstream.type = 'livestream', quagga2 can't read qrcode.(other readers such as ean_reader can be read). Thanks.

ericblade commented 3 years ago

I haven't personally tested it (i guess i'd have to install it into my website and give it a shot to find out... i could probably do that sometime..), but other users have reported that it did in fact work, with the most recent versions of both this and @ericblade/quagga2.

Might be helpful if we could easily codepen this, maybe i'll see if I can get a few minutes to npm release it so it can be used from a cdn

hiroppy commented 3 years ago

Thank you so much!(and sorry, I wrote quagga2 the above but it means @ericblade/quagga2.

ericblade commented 3 years ago

no worries, just wanted to make sure we had the right repo :-) it's just.. this has been on the backburner for entirely too long, i feel really bad that i haven't got to checking this myself, but other people attested that it does work..

i just don't know when i'll get the time to try and set it up myself

hiroppy commented 3 years ago

ok, thanks. anyway, thank you for the development of quagga2!

188599 commented 3 years ago

I am also not having much luck trying to use it.

Relevant code:

import Quagga, { QuaggaJSResultObject } from '@ericblade/quagga2';
import QrCodeReader from '@ericblade/quagga2-reader-qr';

Quagga.init(
    {
        inputStream: {
            target: document.querySelector('#interactive.viewport'),
            constraints: { facingMode: 'environment' },
            area: {
                top: '40%',
                right: '0%',
                left: '0%',
                bottom: '40%'
            },
        },
        decoder: { readers: ['qrcode'] }
    },
    err => {
        ...
    });

And my package.json:

{
  "dependencies": {
      "@ericblade/quagga2": "^1.2.6",
      "@ericblade/quagga2-reader-qr": "git+https://github.com/ericblade/quagga2-reader-qr.git"
  }
}

Edit: Never mind, silly mistake on my code.

ericblade commented 3 years ago

@188599 is it working?

Care to post the working bit here or a CodePen ? Thanks!!

188599 commented 3 years ago

@188599 is it working?

Care to post the working bit here or a CodePen ? Thanks!!

Sorry, I had turned it into a rxjs Observable but forgot to subscribe to it (this happens to me an embarrassing amount of times 🤦), so the code wasn't running. Like I said, silly mistake.

After I fixed that, it worked perfectly.

ericblade commented 3 years ago

@188599 so livestream is working with QR? Awesome! I think I need to do the work to get this published to npm then and hopefully everything will be great from there :-D

@hiroppy

188599 commented 3 years ago

Yes. Publishing to npm would be really nice, if possible.

hiroppy commented 3 years ago

oh, really? so... maybe I mistook something. thank you for the ping, I'll try again

ericblade commented 3 years ago

also https://github.com/ericblade/quagga2/issues/240#issuecomment-712491908