Skip to content
WebViewGold Vibe Coding to App Store
English
Get WebViewGold

Lovable + scanner

Native QR code and barcode scanning for your Lovable app

Browser-based QR scanning in a WebView is slow and permission-hungry. WebViewGold opens the native camera scanner from a link (<code>qrcode://</code> or <code>barcodescanner://</code>) and hands the result straight back to your Lovable app: a URL is opened automatically, a barcode value lands in a JavaScript variable.

From $109 one-time per platform, or let our team do it all from $698.

  • Approval guarantee – or money back within 14 days
  • No coding needed
  • One-time payment, free updates
  • 24/7 human support
  • Made in Germany since 2014 · ISO 27001

What you can build with it

QR check-ins and tickets

Event entry, class attendance, gym check-ins: the QR code contains a URL of your Lovable app with a token, the scanner opens it inside the app, your backend (Supabase or Lovable Cloud (Postgres, storage, edge functions)) validates it.

Barcode lookups

Inventory, product catalogs, price checks: the scanned EAN/UPC value is available as barcodescanresult and can fill a form field or trigger a lookup.

Loyalty and referrals

Members show a QR code, staff scan it with the same app. Both sides are plain pages in Lovable; the camera part is native.

Prompt for Lovable

Paste this into Lovable to implement the web-app side. Review the result, publish, then test inside the WebViewGold app.

Prompt to paste into Lovable
Add native scanning for the WebViewGold app wrapper. 1) Create a route /scan/:code that looks the code up in a Supabase table scan_codes and shows the matching item; QR codes we print will contain that URL. 2) Add a Scan QR code button that sets window.location.href to qrcode:// when navigator.userAgent contains my custom WebViewGold token; otherwise hide it. 3) Add a Scan barcode button that sets window.location.href to barcodescanner:// and then polls the global variable barcodescanresult every 300 ms for up to 60 seconds; when it is set, query products by ean, show the product, and clear the variable. 4) Add an input fallback for manual entry.

With a good optimized version of your web app you can have a stunning mobile app within a couple of minutes. Additionally to that the customer service is very nice and very helpful! I can just recommend WebViewGold :-)

Julian Koch · Co-Founder of DuelDonkey · CodeCanyon

Add the scanner to a Lovable app

About 10 minutes plus your business logic.

  1. Add a scan button

    A link or button that navigates to qrcode:// (QR codes, result URL is opened in the app) or barcodescanner:// (barcodes, result stored in barcodescanresult). Show it only inside the app by detecting the WebViewGold user agent.

  2. Handle the result in your web app

    For QR codes: encode a URL of your Lovable app (for example https://app.yourdomain.com/checkin?token=…); the app opens it like any navigation and your page does the rest. For barcodes: read barcodescanresult after the scanner closes and call your lookup in Supabase or Lovable Cloud (Postgres, storage, edge functions).

  3. Explain the camera permission

    The WebViewGold projects already contain the camera usage description; adjust the text so it names your use case ("to scan tickets at the entrance"). Both stores read these strings.

  4. Choose the scanning mode

    With scanningmode://on, off or auto you control whether the scanner closes after the first hit or keeps scanning, useful for inventory counts.

Barcode result in JavaScript

A minimal handler for the barcode variable:

javascript
// button inside the app
function startScan() { window.location.href = "barcodescanner://"; }

// WebViewGold injects the result into the page
function onScannerClosed() {
  if (typeof barcodescanresult !== "undefined" && barcodescanresult) {
    document.querySelector("#sku").value = barcodescanresult;
    lookupProduct(barcodescanresult);
  }
}

Frequently asked questions

Does the scanner need extra permissions in the stores?

Only the camera permission with a purpose string, which the WebViewGold projects already contain. Describe the use case honestly in the string and in the App Privacy / Data safety answers if you store scan data.

Can I scan from the web app in the browser too?

Yes, with a JavaScript library. The native scanner is faster and uses the system camera UI; detect the app via the user agent and offer the native scanner there, the web library elsewhere.

Which barcode formats are supported?

The common 1D and 2D formats (EAN, UPC, Code 128, QR and more) through the native platform scanner frameworks.

Three ways to get your app into the stores

Same result, different amount of work on your side. All three come with the approval guarantee and 24/7 human support.

Do it yourself

$109 per platform, one-time

The WebViewGold license: a finished Xcode or Android Studio project. Paste your URL, set name and icon, switch on features, build and submit. Free updates forever.

See plans on the main page

Cloud Builder

$349 per license, one-time add-on

No Mac, no Xcode, no Android Studio: configure in the browser, we build both apps in the cloud and hand them to App Store Connect and the Play Console.

How the Cloud Builder works Try the free demo

Full Service

$698 per platform $798

Send us your URL and icon. Our team configures, builds and delivers your app within 72 hours, white-label, with source projects. Both platforms for $1,158.

Full Service details Powered by WeSetupYourWebViewApp

Winter Sale prices valid until December 31, 2026.

Ready to ship your Lovable app?

App Store & Google Play approval guarantee – or your money back within 14 days

Rather hand it over? Full Service: we configure, build and deliver within 72 hours, from $698 per platform. Questions? Chat with us 24/7.

Refunds are granted under the conditions listed in our FAQ: a non-content rejection by Apple and/or Google, claimed within 14 days after purchase.