Welcome to bytebang » The blog about all and nothing » Use your smartphone as IoT enabled QR Scanner

Use your smartphone as IoT enabled QR Scanner

Aug 29 2018

The Problem

In one of my latest IoT projects I needed a QR code scanner which is able to scan continuously and which is able to send the information of the tags via MQTT to a specific broker.

Even after a long googling session I was not able to find one that fits my needs. Either they were too expensive, too big or they where not able to send the results via MQTT.

I needed something in the shape and size of a smart phone with nearly zero costs. ... and what could that be ? ... A smart phone with a suitable App. Unfortunately I did not find anything useful in the google play store.

The Solution

Initially i thought that it would be a good idea to develop such an App - but i turned out that the solution is much simpler. HTML5 enables you to access the built-in camera to scan QR codes, and from a previous project i knew that there is a Javascript based MQTT Client available.

So all I had to do was to combine these two technologies. The result is a single *.html file which contains all links, stylesheets and so on which are needed to get it running with my Android based smartphone (under google chrome):


The usage is simple: Just open the page and wave a qr code in front of the camera. The latest scan result is shown in the field "Latest local scan". If you want to transmit it via MQTT then just fill out the needed fields.

As soon as you press connect the mqtt client tries to contact you broker and subscribes the "Target Topic". Every message which as soon as it is contacted it will start to display the latest messages within this topic.

The expected behaviour is that you wave a qr code in front of your phone. Short afterwards the content of the QR code should be shown within the Latest Local Scan field, and if you are connected to a broker, then it should also be visible in the "Latest Message in the Topic" field as well.

If you want to play around with it - you can try it here: http://tinyurl.com/qr2mqtt otherwise you can also download the latest version from git.

If you have any questions - write a ticket on github !

Get Social

(c) 2023, by bytebang e.U. - Impressum - Datenschutz / Nutzungsbedingungen