Technischer Beitrag
Steuern Sie ein Chipkartenlesegerät über Ihren Browser!
In einem früheren Beitraghabe ich gezeigt, wie sich USB-Konnektivität mit NodeJS, der beliebten JavaScript-Laufzeitumgebung, realisieren lässt. In einem Folgebeitraghaben wir gesehen, wie WebSockets für die Interprozesskommunikation zwischen NodeJS und einem beliebigen Browser verwendet werden können – selbst mit älteren Browsern, die WebSockets nicht unterstützen.
Durch die Kombination von USB-Verbindungscode und WebSockets-Code ist es möglich, ein USB-Gerät (wie unser VP3300 3-in-1-Kartenlesegerät, rechts abgebildet) über eine Webseite ausschließlich mit JavaScript zu steuern. Genau diesen Code möchte ich Ihnen heute vorstellen.
Falls Sie die Skripte aus meinen vorherigen Beiträgen noch nicht heruntergeladen haben, kein Problem: Das nachstehende Skript (ca. 360 Zeilen JavaScript) enthält alles, was Sie benötigen – mit Ausnahme von Node selbst. Wir werden den Code gleich im Detail besprechen, aber zunächst möchte ich erklären, wie man ihn verwendet.
SO VERWENDEN SIE DAS SKRIPT (DER EINFACHE WEG)
1. Rufen Sie die ID TECH Knowledge Base auf und laden Sie das node-driver.zip -Archiv herunter. (Keine Anmeldung erforderlich.) HINWEIS: Es handelt sich um einen größeren Download (11 Megabyte), da Node.exe enthalten ist – bitte rechnen Sie mit einigen Sekunden Ladezeit. Diese Version ist ausschließlich für Windows-Systeme geeignet. Speichern Sie das Archiv an einem beliebigen Ort auf Ihrem lokalen Rechner.
2. Entpacken Sie das Archiv. Es enthält alle benötigten Skripte. (Ein manuelles Kopieren des unten aufgeführten Codes ist nicht erforderlich!)
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 zum Gerät her.
5. Öffnen Sie die Datei client.html (im Archiv enthalten) 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 JavaScript-Zeilen weiter unten? Kopieren Sie den gesamten Code, fügen Sie ihn in eine Textdatei ein und speichern Sie diese z. B. als driver.js.
Installieren Sie NodeJS auf Ihrem Rechner, falls noch nicht geschehen. Bevor Sie 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 (den unten aufgeführten Code) mit Node aus. Um vom Browser aus eine Verbindung zum Treiber herzustellen, erstellen Sie eine HTML-Seite mit folgendem Inhalt:
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.slim.js"></script>
Und außerdem:
Sie müssen das Skript socket.io.slim.js importieren, um die Websockets-Implementierung von socket.io verwenden zu können. Verwenden Sie die Variable socket (var socket, siehe 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 herzustellen:
Der erste Teil dieses Codes enthält die Definition der USBProvider-Klasse (in der von Node unterstützten ECMA-6-Notation), auf die ich in einem früheren Beitrageingegangen bin. Der mittlere Abschnitt des Codes enthält die Definition der SocketProvider-Klasse, die die Erstellung eines Websockets-Servers ermöglicht. Der untere Teil 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-Datenobjekts 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
Die cmd Der oben gezeigte String repräsentiert die rohen Hex-Bytes des Befehls „Get Terminal Settings" für die ID TECH-Geräte UniPay III, BTPay Mini oder VP3300.
In der client.html Datei, die dem node-driver.zip zuvor erwähnten Archiv beiliegt, habe ich bereits eine Methode namens getTerminalSettings() integriert, die den obigen Befehl an das verbundene Gerät sendet. Wenn Sie diesen Befehl in der client.html-Konsole ausführen, erhalten Sie eine detaillierte Auflistung der Geräteeinstellungen, wie nachfolgend dargestellt:
Dieser Screenshot zeigt einige der Standard-Terminaleinstellungen 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 die wichtigsten Erkenntnisse aus diesem Beitrag sowie den beiden vorangegangenen Beiträgen zur USB-Konnektivität kurz zusammenfassen. Wir haben unter anderem gesehen, dass:
1. Mit Hilfe von NodeJS (einer zu Recht populären Open-Source-JavaScript-Laufzeitumgebung) lässt sich jedes USB-Gerät problemlos über JavaScript ansprechen. Das allein ist schon bemerkenswert!
2. Mit nur 75 Codezeilen können Sie Node ebenso einfach einsetzen, um einen Websocket-Server zu erstellen, der eine schnelle, unkomplizierte, zuverlässige und sichere Interprozesskommunikation auf jedem Node-fähigen Gerät ermöglicht.
3. Ihre Node-Skripte können USB-Daten (über Websockets) problemlos an jeden Browser übermitteln, der Websockets unterstützt – also an jeden modernen Browser.
4. Dadurch ist es ohne Weiteres möglich, JavaScript im Webbrowser zu nutzen, um ein per USB angeschlossenes Gerät (z. B. ein Kreditkartenlesegerät) an Ihrem Laptop, PC, Tablet oder einem anderen Host zu steuern. All das bedeutet im Weiteren, dass Sie leistungsstarke browserbasierte Zahlungsanwendungen entwickeln können, die mit einer Vielzahl von ID TECH Kartenlesegeräten kommunizieren – und das ausschließlich mit JavaScript. Es ist nicht erforderlich, nativen Code in C oder C++ zu schreiben.So lassen sich nahezu beliebige Zahlungsanwendungen mit minimalem Programmieraufwand sehr schnell als Prototyp umsetzen.
In künftigen Beiträgen werde ich ausführlicher darauf eingehen, wie sich Web-Technologien nutzen lassen, um Zahlungsanwendungen zu entwickeln, die ID TECH Lesegeräte einbinden. Schauen Sie bald wieder vorbei!
Wenn Sie in der Zwischenzeit mehr über die Produkte von ID TECH erfahren möchten, erreichen Sie uns gebührenfrei unter: