Websocket com Node.js

Os aplicativos da Web estão mudando e evoluindo, o que torna as necessidades dos usuários diferentes de quando o primeiro protocolo de conexão foi criado na rede. Consequentemente, o protocolo HTTP evoluiu ao longo dos anos, mas ainda não atingiu um nível de tempo real, como uma conexão TCP entre duas equipes.
Essas limitações, ao invés de prejudicar desenvolvedores e usuários, tornaram-se uma fonte de motivação e criatividade, gerando soluções que nos permitem não só emular um sistema de transmissão em tempo real, mas também através HTTP faça quase nativamente.
WebsocketÉ aqui que o Websocket, um protocolo relativamente novo que só é suportado pelos navegadores mais modernos, o que nos permite retirar de HTTP todas as suas restrições e, assim, sermos capazes de nos comunicar de maneira eficaz por meio de cabeçalhos OBTER.
Websocket Ainda está em fase de maturação ativa pelo que é bem possível que não o encontremos em novas soluções, felizmente em Node.js já temos algumas ferramentas que nos permitem manipulá-las sem ter que contar com nossa engenhosidade para construir ferramentas de nível inferior.
RequisitosEste é um tutorial avançado, portanto, primeiro exigiremos uma instalação funcional do Node.js Em nosso sistema, podemos dar uma olhada neste tutorial antes de continuar a aprofundá-lo. Além disso, precisaremos de permissões de administrador para poder instalar as bibliotecas que vamos usar. Devemos estar familiarizados com os conceitos de JavaScript como por exemplo ligue de volta e funções anônimas. Finalmente, devemos ter um editor de texto como Texto Sublime que nos permite escrever os diferentes códigos que estão nos exemplos.
Para começar a criar um aplicativo que nos permite usar Websockets Devemos primeiro construir uma pequena estrutura, isso é muito simples, mas necessário, esta estrutura consistirá em:
1- Uma pasta onde armazenaremos os arquivos do nosso projeto.
2- Um arquivo chamado server.js, este arquivo, como o próprio nome indica, será o servidor através do qual vamos estabelecer a conexão em tempo real utilizando o Websockets.
3- Um arquivo chamado client.html, este arquivo será a interface para nos comunicarmos com nosso servidor através do navegador, é necessário ter o mesmo para que possamos enviar e receber as informações correspondentes.
Uma vez que temos nossa estrutura definida agora podemos começar a pegar algumas linhas de código, para isso devemos começar instalando uma biblioteca externa chamada ws em nosso meio, pois é este que nos permitirá utilizar o protocolo em questão. Para instalar esta biblioteca, só precisamos abrir nosso console Node.js, estamos localizados na pasta onde estarão nossos arquivos e colocamos o seguinte comando:

 npm install ws

Quando o executamos, podemos ver o seguinte resultado em nosso console de comando:

Depois de instalar a biblioteca podemos continuar nosso trabalho, agora em nosso arquivo server.js Devemos escrever o seguinte código, primeiro vamos ver em que consiste, depois o explicaremos:

 var WSServer = requer ('ws'). Servidor, wss = novo WSServer ({porta: 8085}); wss.on ('conexão', função (soquete) {socket.on ('mensagem', função (msg) {console.log ('Recebido:', msg, '\ n', 'Do IP:', soquete. upgradeReq.connection.remoteAddress); if (msg === 'Olá') {socket.send ('Sim, funciona!');}}); socket.on ('fechar', função (código, desc) {console .log ('Off-line:' + código + '-' + desc);});});

A primeira coisa que fazemos é exigir a biblioteca ws que acabamos de instalar e imediatamente na mesma instrução chame sua classe Servidor, então criamos uma instância com a qual vamos criar um servidor que roda na porta 8085Esta porta pode ser qualquer que tenhamos acesso. Neste caso, 8085 é usado para que não haja conflito com outros serviços que estão atualmente neste ambiente de teste.
Uma vez que definimos nossa instância agora, vamos aplicar o método.em () para o evento de conexão, então no ligue de volta dele passamos um objeto chamado tomada, com isso receberemos as mensagens do cliente e escrevemos uma rotina que se recebermos a palavra "Olá" o servidor retornará uma mensagem, onde por sua vez também imprimiremos algo no console de comando. Finalmente, se fecharmos a conexão, teremos apenas uma mensagem no console.
Assim que tivermos nosso servidor, é hora de construir nosso cliente, para ele no arquivo client.html vamos definir uma estrutura onde vamos colocar tags html e um JavaScript que funcionará como um link para o nosso servidor. Vamos ver a aparência do nosso arquivo:

 WebSockets Client Submit

A parte HTML é bastante simples, temos uma entrada de tipo de texto e um botão de envio, bem como um div saída chamada que é quem receberá as informações do servidor para mostrá-las ao usuário. O interessante vem no rótulo, onde a primeira coisa que fazemos é criar um objeto do tipo WebSocket e indicamos a rota onde você deve encontrá-lo, no nosso caso é o localhost: 8085 e assim podemos ver que o que fizemos no server.js. Em seguida, vinculamos nossos elementos de envio, texto e saída a variáveis ​​que podemos usar.
Então o que fazemos é definir cada um dos métodos que podemos receber do servidor, então toda vez que enviarmos algo será registrado em nossa saída, tudo graças ao método enviar (). O outro método que usamos é o onmessage () que é ativado apenas se nosso servidor responder e adicionarmos o resultado em nosso HTML.
Finalmente usamos os métodos onclose () Y onerror (), o primeiro nos dá uma mensagem quando a conexão com o Websocket é interrompido ou fechado, e o segundo nos informa caso tenha ocorrido algum erro. Com isso, basta iniciar o servidor em nosso console e colocar nosso exemplo para funcionar, para isso utilizamos o seguinte comando:

 node server.js

Isto irá iniciar o servidor, mas para verificar a funcionalidade de nosso código devemos executar nosso arquivo client.html em nosso navegador de escolha e escrever algo na caixa de texto e pressionar o botão enviar, isto irá gerar comunicação com o websocket e podemos ver a resposta pelo console:

Na imagem podemos ver como o console de comando imprime a mensagem recebida até mesmo registra o endereço IP de onde está recebendo os dados, foi isso que programamos em nosso arquivo server.js, onde também indicamos que se recebêssemos a palavra "Olá" enviaríamos uma mensagem de resposta que é exatamente o que vemos na janela do navegador na mesma imagem. Agora se atualizarmos o navegador a conexão foi interrompida, isso também é registrado pelo nosso aplicativo, vejamos:

Finalmente, se fecharmos a conexão em nosso console com CTRL + C Para parar o servidor, nosso navegador dispara o manipulador de erros e lá veremos uma nova mensagem:

Se formos observadores, podemos ter notado algo importante, em nenhum momento para receber respostas tivemos que atualizar o navegador ou fazer uma solicitação Ajax, tudo foi bidirecional diretamente com WebSockets, isso é o que chamamos de tempo real.
O que mostramos é uma das formas mais rudimentares e manuais que existem, porém funciona para nós sabermos como é o fluxo de trabalho, mas a funcionalidade real pronta para ambientes de produção é alcançada com a biblioteca socket.io, isso faz a mesma coisa que fizemos no tutorial, mas de uma forma muito mais compacta e menos sujeita a erros por parte do desenvolvedor, o que nos permite focar apenas na lógica da aplicação e não tanto na parte técnica dela.
Para instalar socket.io nós apenas temos que fazer um npm install socket.io e com isso do repositório vamos baixar a última versão estável da biblioteca, que nos permitirá iniciar nosso desenvolvimento.
Com isso terminamos este tutorial, com o qual demos um passo importante dentro Node.js sabendo como usar o Websockets, essa tecnologia está se tornando mais importante a cada dia, pois nos ajuda a criar aplicativos que nunca foram pensados ​​na web. Também é importante que nos documentemos sobre o protocolo, pois é uma forma de entender o potencial do que podemos alcançar simplesmente desenvolvendo aplicativos.