socket-io, socket-io-stream

browser.js

// client(browser)
import io from 'socket.io-client';
import ss from 'socket.io-stream';

socket.on('connect', function(){
  console.log('client:', socket.id, socket);
  const options = {
    headers:{
      'Content-Type':'image/svg+xml',
    }
  };

  request.get(LOCAL_URL_FILE, options, function(err, res, body){
    if (err) {
      console.log(err);
    } else {
      dwgSrc = body;
      // console.debug(typeof dwgSrc);
      props.store.setCompleted(20);
      // props.store.restartSrc(dwgSrc);
      var blobfile = new Blob([dwgSrc], {type:'image/svg+xml'});
      console.log('send DWG', blobfile, blobfile.size, blobfile.type);

      const stream = ss.createStream();
      
      setInterval(function(){
        socket.emit('hello', {txt:'hello world!'});
        socket.send('hi');
      },500);

      ss(socket).emit('dwg', stream, {name:'grallardo.dwg', size:blobfile.size});
      ss.createBlobReadStream(blobfile).pipe(stream);
    }
  })
});

socket.on('connect_error', function(error){
  console.log(error);
});

ss(socket).on('svg', function(stream, filename){
  
  console.log('svg', filename);
  stream.on('data', function(data){
    for(var i=0;i<data.length;i++) {
      binaryString+=String.fromCharCode(data[i]);
    }
  });

  stream.on('end',function(){
    // console.log(binaryString);
    props.store.restartSrc(binaryString);
    props.store.setCompleted(100);
    setTimeout(function(){
      socket.disconnect();
    },1000);
  });

});

socket.on('disconnect', function(){
  console.log('client disconnected from server');
});

server.js

// server
var io = require('socket.io')(server);
var ss = require('socket.io-stream');

io.of('/file').on('connection', function (socket) {
  console.log('a user connected: ', socket.id);

  io.set('heartbeat interval', 500);
  io.set('heartbeat timeout', 1500);
  socket.emit('news', { value: 10 });

  socket.on('disconnected', function(){
    console.log( socket.name + ' has disconnected at ' + socket.id);
  });

  ss(socket).on('dwg', function(_stream, data){
    console.log(data);
    var dir = './tmp';

    if (!fs.existsSync(dir)){
        fs.mkdirSync(dir);
    }
    _stream.pipe(fs.createWriteStream('./tmp/test.svg'));
    // setTimeout(function(){
    //   socket.emit('news', { value: 40 });
    // },100);
    
    _stream.on('end',function(){
      console.log('end receive DWG');
      setTimeout(function(){
        var stream = ss.createStream();
        ss(socket).emit('svg', stream, {file: 'test.svg'});
        fs.createReadStream('./tmp/test.svg').pipe(stream);
      },1000);
    })
  });

  socket.on('news', function(data){
    console.log(data);
    if(data.value === 60){
      
    }
  });
  // var i = 0;
  // var start = setInterval(function(){
      
  //     socket.emit('news', { value: i*10 });

  //     if(i>=10){
  //       clearInterval(start);
  //     }
  //     i++;
  // }, 500);
  // start;
  
  socket.on('my other event', function (data) {
    console.log(data);
  });

  socket.on('connect_error', function (err) {
    console.log(err);
  });

});