App Bridge Scanner Will Not Open

Hi all,

We just updated to use the new remix-based Node.js/React Shopify app.

When trying to add a function which opens the scanner, on the POS app nothing occurs. The POS app on the device is up to date, and so is the Shopify Node App itself.

We have the code in the documentation here: https://shopify.dev/docs/api/app-bridge-library/reference/scanner

<button onClick={() => openScanner()}>Open Scanner</button>

and then:

async function openScanner() {
    try {
      const payload = await shopify.scanner.capture();
      console.log('Success', payload)
    } catch (error) {
      console.log(error)
    }
  };

Hopefully someone has some insights.

Hi EddySlip

I’ll look into this a bit more but in the meantime can you confirm that the app has the necessary permissions to access the scanner, and are you seeing the console.log message appearing when you hit the button you’re adding, or is the button not appearing at all?

Hi Liam,

Thanks for your reply.

I can confirm that the app has camera permission, but is there more that needs to be done? Previous versions required a totally different setup of code, so perhaps it’s some amalgamation?

With the button, the openScanner function does fire, and I’ve checked and it runs the shopify.scanner.capture() line, but nothing occurs.

Hi Liam,

Just wondered if there’d been any update on this?

Can I know which app to reproduce this issue? I verified on my test app. It works fine on both Android and iOS.