Quagga js library not scanning bar codes in ios safari

[emmanuelprince66]

the library works perfectly on android but it does not scan in all ios devices i have tested on

import Quagga from "@ericblade/quagga2";

Quagga.init(
  {
    inputStream: {
      name: "Live",
      type: "LiveStream",
      target: document.querySelector("#scanner-container"),
      constraints: {
        facingMode: "environment",
      },
      numOfWorkers: 4,
    },

    // frequency: 5,
    // locate: true,
    debug: true, // Set to true to see the debugging information
    decoder: {
      readers: ["ean_reader"], // Specify the barcode format(s) you want to scan
    },
  },
  (err) => {
    if (err) {
      console.error("Error initializing Quagga:", err);
      return;
    }
    Quagga.start();
  }
);

Quagga.onDetected((data) => {
  setResult(data.codeResult.code);
  setOpen(true);
});

return () => {
  Quagga.stop();
};

}, []);
please i need help!

[ericblade]

My understanding is that when you ask for "facingMode: environment" in current versions of iOS, you'll get the absolute widest angle lens that iOS can provide, which will result in the image being horribly stretched and fisheyed.

I am not aware of what other constraints would tell it, perhaps something with aspect ratio, resolution, etc, that would get a camera with the properties necessary to provide good images.

I always recommend providing the user a way to select which camera device to use, and then providing that as a deviceId constraint, rather than using facingMode.

A React sample that includes camera device enumeration and selection is here https://github.com/ericblade/quagga2-react-example/blob/master/src/App.js

If you explore other device constraints and find a way to get it to automatically give you a working image, please let us know :)

other references #499 #423 #419 #396 probably others

[emmanuelprince66]

Thanks alot i will check it out.. Keep up the good work

…

On Wed, Jul 26, 2023, 8:09 PM Eric Blade ***@***.***> wrote: My understanding is that when you ask for "facingMode: environment" in current versions of iOS, you'll get the absolute widest angle lens that iOS can provide, which will result in the image being horribly stretched and fisheyed. I am not aware of what other constraints would tell it, perhaps something with aspect ratio, resolution, etc, that would get a camera with the properties necessary to provide good images. I always recommend providing the user a way to select which camera device to use, and then providing that as a deviceId constraint, rather than using facingMode. A React sample that includes camera device enumeration and selection is here https://github.com/ericblade/quagga2-react-example/blob/master/src/App.js If you explore other device constraints and find a way to get it to automatically give you a working image, please let us know :) other references #499 <#499> #423 <#423> #419 <#419> #396 <#396> probably others — Reply to this email directly, view it on GitHub <#506 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AR3WEA44A6NI5ROBZNIVH5DXSFTNDANCNFSM6AAAAAA2X6PHYU> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[ericblade]

did you find something that worked for the constraints, or just have the user pick a camera?

[emmanuelprince66]

Thanks alot everthin works fine now I really appreciate ur help On Thu, Jul 27, 2023, 9:51 AM Emmanuel Ochigbo ***@***.***> wrote:

…

Thanks alot i will check it out.. Keep up the good work On Wed, Jul 26, 2023, 8:09 PM Eric Blade ***@***.***> wrote: > My understanding is that when you ask for "facingMode: environment" in > current versions of iOS, you'll get the absolute widest angle lens that iOS > can provide, which will result in the image being horribly stretched and > fisheyed. > > I am not aware of what other constraints would tell it, perhaps something > with aspect ratio, resolution, etc, that would get a camera with the > properties necessary to provide good images. > > I always recommend providing the user a way to select which camera device > to use, and then providing that as a deviceId constraint, rather than using > facingMode. > > A React sample that includes camera device enumeration and selection is > here > https://github.com/ericblade/quagga2-react-example/blob/master/src/App.js > > If you explore other device constraints and find a way to get it to > automatically give you a working image, please let us know :) > > other references #499 <#499> > #423 <#423> #419 > <#419> #396 > <#396> probably others > > — > Reply to this email directly, view it on GitHub > <#506 (comment)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AR3WEA44A6NI5ROBZNIVH5DXSFTNDANCNFSM6AAAAAA2X6PHYU> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> >

[emmanuelprince66]

I actually allowed the user to select the camera of choice I belive that's better What do you think of that?

…

On Mon, Jul 31, 2023, 1:45 PM Eric Blade ***@***.***> wrote: did you find something that worked for the constraints, or just have the user pick a camera? — Reply to this email directly, view it on GitHub <#506 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AR3WEA3PNRPF4YVBSZTC22TXS6SGRANCNFSM6AAAAAA2X6PHYU> . You are receiving this because you authored the thread.Message ID: ***@***.***>