05/04/2012 Development / java script

Dando continuidade aos exemplos...Vamos supor que a gente queira atualizar de 1 em 1 segundos a página do cliente. Ex: A gente ficar varrendo um arquivo txt, ou só gerando um Date.toLocaleTimeString() ;-)

Novamente a parte do server. É muito importante termos esse conhecimento que quase tudo rola em torno disso. Levantar o server e depois consumir. É uma receita de bolo, com o tempo você acostuma. É como se fosse escrever um confirm("blabla")...prompt("tche...tche..re..tche...tche..tche")...e assim por diante

var http = require('http'), fs = require('fs');

//Escrevendo várias vezes no response (fazer com o curl para ver melhor)
var server = http.createServer(function(request, response)
{
 switch(request.url)
 {
  case '/':
   fs.readFile(__dirname + '/index.html', function (err, data){
    if (err) {
     response.writeHead(500, {"Content-Type":"text/html"});
     return response.end('Error loading index.html');
    } else {
     response.writeHead(200, {"Content-Type":"text/html"});
     response.end(data);
    }
   });
  break;
  case '/stream':
   response.writeHead(200, {"Content-Type":"text/json"});

   setInterval(function(){ response.write((new Date()).toLocaleTimeString()); }, 1000);

   /*
   file = __dirname + '/arquivo.txt';
   fs.watch(file, function(curr, prev){
    fs.readFile(file, function (err, dados){
     response.write(dados);
    });
   });
   */
  break;
 }
}).listen(8181); // Temos nosso server na porta 8181

Agora vamos consumir

var io = require('socket.io').listen(server); // Aqui eu digo que vou consumir esse server usando socket.io

// Requisição client para buscar o stream, e envia via socket
var options = {
  host: 'localhost',
  port: 8181,
  path: '/stream',
  method: 'GET'
};
var reqStream = http.request(options, function(res)
{
 if(res.statusCode==200)
 {
  res.setEncoding('utf8');
  res.on('data', function (chunk){
   io.sockets.emit('update_dados', { dados: chunk });
  });

  res.on('end', function(){
   io.sockets.emit('close_dados');
  });

 } else {
  io.sockets.emit('close_dados');
 }
});
reqStream.end();

Agora só fazer a parte /* Cliente - index.html */

<html>
  <head>
    <title>Dashboard</title>
 <script src="/socket.io/socket.io.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
 <script>
  $(document).ready(function(){

   socket = io.connect();

   socket.on('update_dados', function(json){
    $("#div_dados").html(json.dados);
   });

   socket.on('close_dados', function(){
    $("#div_dados").html('Fim da Transmissao!');
   });
  });

 </script>
  </head>
  <body>
 <h2>DASHBOARD</h2>
 <p id="div_dados"></p>
  </body>
</html>