Post Técnico
Controle um Leitor de Cartão com Chip pelo seu Navegador!
Em um post anterior, mostramos como estabelecer conectividade USB usando o NodeJS, o popular mecanismo de execução JavaScript. Em um post de acompanhamento, vimos como os Websockets podem ser usados para comunicação entre processos no NodeJS e em qualquer navegador (inclusive navegadores mais antigos que não suportam Websockets).
Ao combinar o código de conectividade USB com o código de Websockets, uma página web pode controlar um dispositivo USB — como o nosso VP3300, leitor de cartão 3 em 1 exibido ao lado — usando apenas JavaScript. É exatamente esse código que apresentaremos hoje.
Caso você ainda não tenha baixado os scripts dos posts anteriores, não se preocupe: o script a seguir (com cerca de 360 linhas de JavaScript) contém tudo o que você precisa (exceto o próprio Node). Falaremos sobre o código em breve, mas primeiro vamos ver como utilizá-lo.
COMO USAR O SCRIPT (DO JEITO MAIS FÁCIL)
1. Acesse a Base de Conhecimento da ID TECH e faça o download do arquivo node-driver.zip . (Não é necessário login.) NOTA: Este é um download de tamanho considerável (11 megabytes), pois inclui o Node.exe, portanto aguarde alguns segundos. Atenção: é compatível apenas com sistemas Windows. Salve o arquivo em qualquer local do seu computador.
2. Extraia o arquivo compactado. Ele contém todos os scripts necessários. (Não é preciso copiar/colar o código exibido abaixo!)
3. Na pasta extraída, localize o arquivo chamado start.bat. Execute-o. (Uma janela de console será aberta; deixe-a aberta.) O driver Node está agora em execução.
4. Conecte um dispositivo compatível (ID TECH BTPay Mini, VP3300, UniPay III, VP8800) à porta USB do seu computador. O driver Node se conectará a ele automaticamente.
5. Abra o arquivo client.html (contido no arquivo extraído) em um navegador web. Clique no botão Conectar. Você deverá ver uma mensagem confirmando que uma conexão Websocket foi estabelecida na porta 9901. O driver utilizará essa conexão para se comunicar com o seu dispositivo USB.
COMO USAR O SCRIPT (USUÁRIOS AVANÇADOS)
Veja as aproximadamente 360 linhas de JavaScript abaixo? Copie e cole tudo em um arquivo de texto e salve-o como, por exemplo, driver.js.
Instale o NodeJS em sua máquina, caso ainda não tenha feito isso. Mas antes de executar o driver.js com o Node, realize as seguintes etapas.
Use o npm para instalar os seguintes módulos do Node (disponíveis no Github, entre outros):
1. node-hid (para conectividade USB)
2. socket.io (para conectividade via Websockets)
3. socket.io-client (para que scripts Node possam funcionar como clientes socket.io)
Agora execute o driver.js (o código exibido abaixo) usando o Node. Para conectar-se ao driver a partir de um navegador, crie uma página HTML contendo:
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.slim.js"></script>
E também:
É necessário importar o script socket.io.slim.js para utilizar a implementação de Websockets do socket.io. Use a variável socket (var socket, acima) para emitir mensagens via Websocket.
Veja o código que você precisa executar no Node para ter conectividade USB em um navegador, via Websockets:
A primeira parte deste código contém a definição da classe USBProvider (usando a notação ECMA 6 suportada pelo Node), sobre a qual falei em uma postagem anterior. A parte intermediária do código contém a definição da classe SocketProvider, que permite a criação de um servidor Websockets. A metade inferior do código é um "shim" que conecta as duas primeiras partes. Ele cria uma instância de USBProvider e uma instância de SocketProvider, inicializa ambas e estabelece a comunicação entre elas, de modo que os comandos possam ser enviados do navegador ao dispositivo USB por meio de uma estrutura simples de objeto de dados JSON:
Para enviar um comando bruto ao leitor, você fará algo como:
var cmd = "5669564f74656368320060040000f5e1";
dobj = dataObject( 'client',cmd,'raw command');
socket.emit( 'echo', dobj ); // envia o comando ao dispositivo
O cmd A string mostrada acima representa os bytes hexadecimais brutos do comando "Get Terminal Settings" para os dispositivos UniPay III, BTPay Mini ou VP3300 da ID TECH.
No arquivo client.html que acompanha o pacote node-driver.zip mencionado anteriormente, já incluí um método chamado getTerminalSettings() que envia o comando acima ao dispositivo conectado. Ao executar esse comando no console do client.html, você obtém uma listagem detalhada das configurações do dispositivo, conforme mostrado abaixo:
Esta captura de tela exibe algumas das configurações padrão de terminal do produto ID TECH BTPay Mini (VP3300). (OBSERVAÇÃO: Nem todas as configurações são exibidas, pois a captura de tela não registrou toda a área rolável.)
RESUMO
Vamos revisar rapidamente alguns dos pontos mais importantes deste artigo e dos dois anteriores sobre conectividade USB. Vimos, entre outras coisas, que:
1. Com o auxílio do NodeJS (um mecanismo de runtime JavaScript de código aberto amplamente popular e merecidamente reconhecido), é possível se comunicar facilmente com qualquer dispositivo USB usando JavaScript. Isso por si só já é bastante impressionante!
2. Também é possível, com apenas 75 linhas de código, usar o Node para criar um servidor Websocket que permita uma comunicação entre processos rápida, simples, robusta e segura em qualquer dispositivo que suporte o Node.
3. Seus scripts Node podem transmitir facilmente dados USB (via Websockets) para qualquer navegador compatível com Websockets — ou seja, qualquer navegador moderno.
4. Como resultado, é perfeitamente possível usar JavaScript, executado em um navegador web, para controlar um dispositivo USB (como um leitor de cartão de crédito) conectado ao seu notebook, PC, tablet ou outro host. Tudo isso significa que você pode criar aplicativos de pagamento baseados em navegador, altamente funcionais, capazes de se comunicar com qualquer número de leitores de cartão ID TECH usando apenas código JavaScript. Não há necessidade de escrever código nativo em C ou C++.Assim, você pode prototipar praticamente qualquer aplicativo de pagamento de forma muito rápida e com pouco esforço de codificação.
Em posts futuros, terei muito mais a dizer sobre como usar tecnologia web para criar aplicativos de pagamento que aproveitam os leitores da ID TECH. Volte em breve para mais novidades!
Enquanto isso, se você quiser saber mais sobre qualquer um dos ID TECH Products, ligue para nós gratuitamente: