Search code examples
google-apps-scriptqr-code

Is it possible to scan a QR code with google app script?


I want to create a web app using Google Apps Script (because that is the only platform I have web app experience with) that scans and returns data from a QR code.

I have done some digging, but I can't find anything about using a GAS web app to access and read from the camera. Does anyone know if there is a way to do this?

The goal is to have a web app that can scan a QR code and search a Google Sheet for the item linked to that QR code. I can do everything but get the camera to open/scan (if even possible).

TIA


Solution

  • You can integrate minhaz solution as follows

    gs

    function onOpen() {
      SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
          .createMenu('QRCode')
          .addItem('Open QRCode reader', 'showDialog')
          .addToUi();
    }
    
    function showDialog() {
      var html = HtmlService.createHtmlOutputFromFile('Page')
          .setWidth(600)
          .setHeight(480);
      SpreadsheetApp.getUi().showModalDialog(html, 'QRCode reader');
    }
    
    function getQRCode(txt){
      SpreadsheetApp.getActiveRange().setValue(txt)
    }
    

    Page.html

    <!DOCTYPE html>
    <html>
    <head>
      <script src="https://unpkg.com/html5-qrcode"></script>
    </head>
    <body>
      <div id="qr-reader" style="width:500px"></div>
      <script>
        var resultContainer = document.getElementById('qr-reader-results');
        function onScanSuccess(decodedText, decodedResult) {
          google.script.run.getQRCode(decodedText); 
          google.script.host.close();
        }
        var html5QrcodeScanner = new Html5QrcodeScanner("qr-reader", { fps: 10, qrbox: 250 });
        html5QrcodeScanner.render(onScanSuccess);
      </script>
    </body>
    </html>
    

    Then adapt getQRCode function in gs code to your needs.