Barcode Erkennung im Browser mit JavaScript

Robuste, portable und performante Bildverarbeitung zur Erkennung von Barcodes in Browsern als Alternative zur nativen App.

Customer Self-Service Apps auf Smartphones k├Ânnen durch Benutzung von Barcodes die fehlerfreie Erfassung von Bestellungen vereinfachen und beschleunigen. Jedoch ist die Entwicklung und Wartung von Applikationen f├╝r die verschiedenen Plattformen (iOS, Android, etc. ) teuer oder die Service Infrastruktur zur Anbindung im Hintergrund nicht vorhanden.

Aber durch den Einsatz von Frameworks wie PhoneGap kann einerseits von der unten liegenden Ger├Ąteplattform abstrahiert werden, andererseits unterst├╝tzen diese Werkzeuge die Entwicklung mit Web-Technologien wie Html5, JavaScript und CSS (und damit oft die Wiederverwendung von im Unternehmen bereits vorhandenem Know-How).

Es stellt sich nun nat├╝rlich die Frage, inwiefern diese Technologien zur L├Âsung von Performance-kritischen Problemen geeignet sind. Eines dieser Probleme ist z.B. die Bildverarbeitung (Computer-Vision), die zum Erkennen eines Barcodes in einem Bild notwendig wird.

Ggf. m├╝ssen zum Laden externen Bildquellen (Domain nicht lx-networking.de) die Sicherheitseinstellungen des Browsers angepasst werden. Die Same-Origin-Policy der Browser l├Ąsst zwar das nachladen der Bilder von einer anderen Domain zu, jedoch k├Ânnen nur Bilddaten der selben Domain per JavaScript ausgelesen werden.

Die derzeitige Implementierungen kann nur EAN13 (ISBN, UPAC) Codes erkennen. Da der Code nur als Proof-of-Concept dient, wurde die Verarbeitung der Pr├╝fziffer ausgespart. Die Bilddaten werden aus einem Canvas-Element ausgelesen und dann verarbeitet. Die einzelnen Verarbeitungs-Filter sind im Moment nicht optimiert. Dennoch ist die Verarbeitungsgeschwindigkeit auch auf mobilen Ger├Ąten (iPhone 4, iPad 2, etc) beachtlich. Die Erkennung eines Barcodes in einem Bild mit VGA Aufl├Âsung dauert weniger als 500ms. Da keine exotischen ECMAScript/JavaScript Sprachfeatures n├Âtig sind, funktioniert der Code in IE8/9, Firefox, Safari, Android und iOS ohne Weiteres.

Der Quellcode ist unter https://bitbucket.org/jrosskopf/balkenkode unter der MIT-Lizenz also OpenSource zu beziehen. Bei ├änderungsw├╝nschen, Erweiterungen oder Anbindung an Ger├Ątefunktionen stehen wir Ihnen gerne zur Verf├╝gung. Kontaktieren Sie uns unverbindlich unter info@lx-networking.de