Article technique
Pilotez un lecteur de carte à puce depuis votre navigateur !
Dans un article précédent, j'ai expliqué comment établir une connectivité USB à l'aide de NodeJS, le moteur d'exécution JavaScript très répandu. Dans un article de suivi, nous avons vu comment les WebSockets peuvent être utilisés pour la communication inter-processus entre NodeJS et n'importe quel navigateur (même les navigateurs plus anciens qui ne prennent pas en charge les WebSockets).
En combinant le code de connectivité USB et le code WebSockets, il devient possible pour une page web de contrôler un périphérique USB (comme notre lecteur de carte 3-en-1 VP3300, illustré à droite) en utilisant uniquement JavaScript. C'est ce code que je souhaite vous présenter aujourd'hui.
Si vous n'avez pas encore téléchargé les scripts de mes articles précédents, pas d'inquiétude : le script ci-dessous (environ 360 lignes de JavaScript) contient tout ce dont vous avez besoin (à l'exception de Node lui-même). Nous examinerons le code dans un moment, mais commençons d'abord par expliquer comment l'utiliser.
COMMENT UTILISER LE SCRIPT (LA MÉTHODE SIMPLE)
1. Rendez-vous sur la base de connaissances ID TECH et téléchargez le node-driver.zip archive. (Aucune connexion requise.) REMARQUE : Il s'agit d'un téléchargement de taille conséquente (11 mégaoctets), car il inclut Node.exe — prévoyez quelques secondes. De plus, il est réservé aux machines Windows. Placez l'archive à l'emplacement de votre choix sur votre machine locale.
2. Décompressez l'archive. Elle contient tous les scripts dont vous avez besoin. (Inutile de copier-coller le code affiché ci-dessous !)
3. Dans l'archive décompressée, repérez le fichier intitulé start.bat. Exécutez-le. (Une fenêtre de console s'ouvrira ; laissez-la simplement ouverte.) Le pilote Node est maintenant en cours d'exécution.
4. Branchez un appareil compatible (ID TECH BTPay Mini, VP3300, UniPay III, VP8800) sur le port USB de votre machine. Le pilote Node s'y connectera automatiquement.
5. Ouvrez le fichier client.html (inclus dans l'archive) dans un navigateur web. Cliquez sur le bouton Connecter. Un message devrait s'afficher pour confirmer qu'une connexion Websocket a été établie sur le port 9901. Le pilote utilisera cette connexion pour communiquer avec votre périphérique USB.
UTILISATION DU SCRIPT (UTILISATEURS AVANCÉS)
Vous voyez les quelque 360 lignes de JavaScript plus bas ? Copiez-collez l'intégralité de ce code dans un fichier texte et enregistrez-le sous le nom driver.js, par exemple.
Installez NodeJS sur votre machine si ce n'est pas déjà fait. Avant d'exécuter driver.js avec Node, effectuez les opérations suivantes.
Utilisez npm pour installer les modules Node suivants (disponibles sur Github, etc.) :
1. node-hid (pour la connectivité USB)
2. socket.io (pour la connectivité WebSockets)
3. socket.io-client (pour permettre aux scripts Node d'agir en tant que clients socket.io)
Exécutez maintenant driver.js (le code présenté ci-dessous) avec Node. Pour vous connecter au pilote depuis un navigateur, créez une page HTML contenant :
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.slim.js"></script>
Ainsi que :
Vous devez importer le script socket.io.slim.js pour pouvoir utiliser l'implémentation Websockets de socket.io. Utilisez la variable socket (var socket, ci-dessus) pour émettre des messages Websocket.
Voici le code à exécuter dans Node afin de disposer d'une connectivité USB dans un navigateur, via Websockets :
La première partie de ce code contient la définition de la classe USBProvider (en notation ECMA 6, prise en charge par Node), dont j'ai parlé dans un article précédent. La partie centrale du code contient la définition de la classe SocketProvider, qui permet la création d'un serveur Websockets. La dernière partie du code constitue un « code shim » reliant les deux premières parties. Elle crée une instance de USBProvider et une instance de SocketProvider, les démarre et interagit avec chacune d'elles, de sorte que les commandes peuvent être envoyées du navigateur vers le périphérique USB à l'aide d'une simple structure d'objet de données JSON :
Pour envoyer une commande brute à un lecteur, vous procéderez comme suit :
var cmd = "5669564f74656368320060040000f5e1";
dobj = dataObject( 'client',cmd,'raw command');
socket.emit( 'echo', dobj ); // envoyer la commande au périphérique
Le cmd La chaîne affichée ci-dessus représente les octets hexadécimaux bruts de la commande « Get Terminal Settings » pour les appareils UniPay III, BTPay Mini ou VP3300 d'ID TECH.
Dans le client.html fichier fourni avec l'archive node-driver.zip mentionnée précédemment, j'ai déjà inclus une méthode appelée getTerminalSettings() qui envoie la commande ci-dessus à l'appareil connecté. Lorsque vous exécutez cette commande dans la console client.html, vous obtenez un relevé détaillé des paramètres de l'appareil, comme illustré ci-dessous :
Cette capture d'écran présente certains des paramètres Terminal Settings par défaut du produit ID TECH BTPay Mini (VP3300). (REMARQUE : tous les paramètres ne sont pas affichés, car la capture d'écran n'a pas couvert l'intégralité de la zone défilante.)
RÉSUMÉ
Passons rapidement en revue les principaux enseignements de cet article et des deux précédents consacrés à la connectivité USB. Nous avons notamment constaté que :
1. Grâce à NodeJS (un moteur d'exécution JavaScript open source particulièrement populaire et à juste titre), il est très facile de communiquer avec n'importe quel périphérique USB en JavaScript. C'est en soi remarquable !
2. Il est également très facile (en 75 lignes de code seulement) d'utiliser Node pour créer un serveur Websocket permettant une communication interprocessus rapide, simple, robuste et sécurisée sur tout appareil compatible avec Node.
3. Vos scripts Node peuvent transmettre facilement des données USB (via Websockets) à n'importe quel navigateur prenant en charge les Websockets — c'est-à-dire tout navigateur moderne.
4. En conséquence, il est tout à fait possible d'utiliser JavaScript, exécuté dans un navigateur web, pour piloter un périphérique USB (tel qu'un lecteur de carte bancaire) connecté à votre ordinateur portable, PC, tablette ou tout autre hôte. Tout cela signifie que vous pouvez créer des applications de paiement web puissantes, capables de communiquer avec n'importe quel lecteur de carte ID TECH, en n'utilisant que du code JavaScript. Il n'est pas nécessaire d'écrire du code natif en C ou C++.Vous pouvez ainsi prototyper presque n'importe quelle application de paiement très, très rapidement, avec un effort de développement minimal.
Dans de prochains articles, j'aurai beaucoup plus à dire sur la façon d'utiliser les technologies web pour créer des applications de paiement tirant parti des lecteurs d'ID TECH. Revenez bientôt pour en savoir plus !
En attendant, si vous souhaitez en savoir plus sur l'un des produits d'ID TECH, appelez-nous au numéro gratuit :