Technischer Beitrag
Chip-Kartenleser direkt über den Browser steuern!
In einem früheren Beitraghabe ich gezeigt, wie sich eine USB-Verbindung mithilfe von NodeJS, der beliebten JavaScript-Laufzeitumgebung, aufbauen lässt. In einem Folgeartikelhaben wir gesehen, wie Websockets für die Interprozesskommunikation zwischen NodeJS und jedem Browser genutzt werden können – selbst mit älteren Browsern, die Websockets nicht unterstützen.
Wenn wir den USB-Verbindungscode und den Websockets-Code miteinander verknüpfen, kann eine Webseite ein USB-Gerät (wie unseren VP3300 3-Wege-Kartenleser, rechts abgebildet) allein mit JavaScript steuern. Genau diesen Code möchte ich Ihnen heute vorstellen.
Falls Sie die Skripte aus meinen vorherigen Beiträgen noch nicht heruntergeladen haben, ist das kein Problem: Das folgende Skript (rund 360 Zeilen JavaScript) enthält alles, was Sie benötigen – mit Ausnahme von Node selbst. Wir werden den Code gleich besprechen, aber zunächst möchte ich erklären, wie man ihn verwendet.
SO VERWENDEN SIE DAS SKRIPT (AUF EINFACHEM WEG)
1. Rufen Sie die ID TECH Knowledge Base auf und laden Sie die node-driver.zip Archiv. (Keine Anmeldung erforderlich.) HINWEIS: Da die Datei Node.exe enthält, ist der Download mit 11 Megabyte recht umfangreich – bitte etwas Geduld einplanen. Außerdem: Das Archiv ist nur für Windows-Systeme geeignet. Speichern Sie es an einem beliebigen Ort auf Ihrem lokalen Rechner.
2. Entpacken Sie das Archiv. Es enthält alle erforderlichen Skripte. (Die unten aufgeführten Codebeispiele müssen nicht kopiert oder eingefügt werden!)
3. Suchen Sie im entpackten Archiv die Datei start.bat. Führen Sie diese aus. (Ein Konsolenfenster wird geöffnet; lassen Sie es geöffnet.) Der Node-Treiber läuft nun.
4. Schließen Sie ein unterstütztes Gerät (ID TECH BTPay Mini, VP3300, UniPay III, VP8800) an den USB-Anschluss Ihres Rechners an. Der Node-Treiber stellt automatisch eine Verbindung zu dem Gerät her.
5. Öffnen Sie die Datei client.html (im Archiv) in einem Webbrowser. Klicken Sie auf die Schaltfläche „Verbinden". Es sollte eine Meldung erscheinen, die bestätigt, dass eine WebSocket-Verbindung auf Port 9901 hergestellt wurde. Der Treiber nutzt diese Verbindung zur Kommunikation mit Ihrem USB-Gerät.
VERWENDUNG DES SKRIPTS (FÜR FORTGESCHRITTENE BENUTZER)
Sehen Sie die rund 360 Zeilen JavaScript weiter unten? Kopieren Sie den gesamten Code, fügen Sie ihn in eine Textdatei ein und speichern Sie diese beispielsweise unter dem Namen driver.js.
Installieren Sie NodeJS auf Ihrem Rechner, falls noch nicht geschehen. Bevor Sie jedoch driver.js mit Node ausführen, gehen Sie wie folgt vor.
Verwenden Sie npm , um die folgenden Node-Module zu installieren (verfügbar auf Github usw.):
1. node-hid (für USB-Konnektivität)
2. socket.io (für Websockets-Konnektivität)
3. socket.io-client (damit Node-Skripte als socket.io-Clients fungieren können)
Führen Sie nun driver.js (der unten gezeigte Code) mit Node aus. Um sich über einen Browser mit dem Treiber zu verbinden, erstellen Sie eine HTML-Seite, die Folgendes enthält:
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.slim.js"></script>
Sowie außerdem:
Sie müssen das Skript socket.io.slim.js importieren, um die Websockets-Implementierung von socket.io zu nutzen. Verwenden Sie die socket-Variable (var socket, oben) um Websocket-Nachrichten zu senden.
Hier ist der Code, den Sie in Node ausführen müssen, um über Websockets eine USB-Verbindung im Browser zu ermöglichen:
Der erste Teil dieses Codes enthält die Klassendefinition USBProvider (in der von Node unterstützten ECMA-6-Notation), auf die ich in einem früheren Beitrageingegangen bin. Der mittlere Teil des Codes enthält die Klassendefinition SocketProvider, die die Erstellung eines Websockets-Servers ermöglicht. Die untere Hälfte des Codes ist „Shim-Code", der die ersten beiden Teile miteinander verbindet. Er erstellt eine USBProvider-Instanz und eine SocketProvider-Instanz, startet beide und kommuniziert mit ihnen, sodass Befehle mithilfe eines einfachen JSON-Datenobjekt-Konstrukts vom Browser an das USB-Gerät gesendet werden können:
Um einen rohen Gerätebefehl an ein Lesegerät zu senden, gehen Sie wie folgt vor:
var cmd = "5669564f74656368320060040000f5e1";
dobj = dataObject( 'client',cmd,'raw command');
socket.emit( 'echo', dobj ); // Befehl an Gerät senden
Der cmd Der oben gezeigte String repräsentiert die rohen Hex-Bytes des Befehls „Get Terminal Settings" für ID TECH's UniPay III-, BTPay Mini- oder VP3300-Geräte.
In der client.html Datei, die dem node-driver.zip Archiv beiliegt, das zuvor erwähnt wurde, habe ich bereits eine Methode namens getTerminalSettings() integriert, die den obigen Befehl an das verbundene Gerät sendet. Wenn Sie diesen Befehl in der Konsole von client.html ausführen, erhalten Sie eine detaillierte Auflistung der Geräteeinstellungen, wie unten dargestellt:
Dieser Screenshot zeigt einige der Standard-Terminal-Einstellungen des ID TECH BTPay Mini (VP3300). (HINWEIS: Nicht alle Einstellungen sind sichtbar, da der Screenshot den gesamten scrollbaren Bereich nicht erfasst hat.)
ZUSAMMENFASSUNG
Lassen Sie uns kurz die wichtigsten Erkenntnisse aus diesem Beitrag sowie den beiden vorangegangenen Beiträgen zur USB-Konnektivität zusammenfassen. Wir haben unter anderem gesehen, dass:
1. Mithilfe von NodeJS (einer zu Recht beliebten Open-Source-JavaScript-Laufzeitumgebung) lassen sich USB-Geräte problemlos über JavaScript ansprechen. Das allein ist bereits bemerkenswert!
2. Mit lediglich 75 Codezeilen lässt sich über Node problemlos ein Websocket-Server erstellen, der eine schnelle, unkomplizierte, robuste und sichere Interprozesskommunikation auf jedem Node-fähigen Gerät ermöglicht.
3. Node-Skripte können USB-Daten (über Websockets) problemlos an jeden Browser übertragen, der Websockets unterstützt – also an jeden modernen Browser.
4. Dadurch ist es ohne Weiteres möglich, JavaScript in einem Webbrowser einzusetzen, um ein USB-Gerät (z. B. ein Kreditkartenlesegerät) zu steuern, das mit Ihrem Laptop, PC, Tablet oder einem anderen Host verbunden ist. All das bedeutet, dass Sie leistungsstarke browserbasierte Zahlungsanwendungen entwickeln können, die über reinen JavaScript-Code mit einer Vielzahl von ID TECH Kartenlesegeräten kommunizieren. Es ist nicht erforderlich, nativen Code in C oder C++ zu schreiben.So lassen sich nahezu beliebige Zahlungsanwendungen mit minimalem Programmieraufwand sehr schnell prototypisch entwickeln.
In künftigen Beiträgen werde ich ausführlich darauf eingehen, wie sich Web-Technologien nutzen lassen, um Zahlungsanwendungen zu entwickeln, die auf ID TECH-Lesegeräten aufsetzen. Schauen Sie bald wieder vorbei!
Wenn Sie in der Zwischenzeit mehr über die Produkte von ID TECH erfahren möchten, rufen Sie uns gebührenfrei an: