title: socket.io / parameters on connection
body: <p>In my node.js / Express.js app, I need to pass parameters with the socket.io connection (saw that in another post).</p>
  
  <p>On client side, I have something like : </p>
  
  <p><strong>edit</strong></p>
  
  <pre><code>var socket = io.connect('/image/change', {query:"name=my_img_name"});
  var siofu = new SocketIOFileUpload(socket);
  
  siofu.listenOnInput(document.getElementById("change_image_inpt"));
  </code></pre>
  
  <p>On server side : </p>
  
  <p><strong>edit</strong></p>
  
  <pre><code>io.of('/image/change')
    .on('connection', function (socket) {
    console.log('log input param : ' + socket.handshake.query.name);
  });
  </code></pre>
  
  <p>But nothing in the console.</p>
  
  <p>Is there another way to achieve that ?</p>
  
  <p><strong>edit2</strong></p>
  
  <p>This is the full code for client : </p>
  
  <pre><code>$(document).ready(function() {
  
  // icon_action_modal
  $('.icon_actions').on('click', function() {
      // set icon preview
      $('#icon_action_modal_icon_preview').html('&lt;img src="/upload/icon/' + $(this).data('icon') + '.png" /&gt;');
  
      // set icon to delete
      $('#icon_name').val($(this).data('icon'));
  
      // set Change icon socket
      var socket = io.connect('/icon_sets/change', {query:"name=my_img_name"});
      var siofu = new SocketIOFileUpload(socket);
  
      siofu.listenOnInput(document.getElementById("change_icon"));
  
      // Do something when a file is uploaded
      siofu.addEventListener("complete", function () {
          $('.overlay').hide();
      });
  
      // display loader window
      socket.on('displayOverlay', displayOverlay);
  
      // display
      socket.on('displayIconImage', function (data) {
          $('#iconset_render').append('&lt;div class="icon"&gt;&lt;img src="' + data.path + '" /&gt;&lt;/div&gt;');
      });
  
      socket.on('setIconsetArray', function (data) {
          var iconset = ($('#iconset_array').val()) ? JSON.parse($('#iconset_array').val()) : [];
  
          iconset.push(data.iconName);
  
          $('#iconset_array').val(JSON.stringify(iconset));
  
          deleteIcon($('#icon_name').val());
  
          // close modal
          $('#icon_action_modal').modal('hide');
      });
  
  });
  
  $('#icon_action_modal_delete_icon').on('click', function() {
      deleteIcon($('#icon_name').val());
  
      // close modal
      $('#icon_action_modal').modal('hide');
  });
  
  }); // end document.ready
  </code></pre>
  
  <p>And the full code for server side : </p>
  
  <pre><code>io.of('/icon_sets/change')
    .on('connection', function (socket) {
      console.log('log input param : ' + socket.handshake.query.name);
      functions.socketImageTransfer(socket, 'icon', 65, 65);
  });
  </code></pre>
  
  <p>With the <code>socketImageTransfer</code> function : </p>
  
  <pre><code>module.exports.socketImageTransfer = function(socket, type, width, height, name) {
  
  var socketioFileUploadServer    = require('socketio-file-upload');   // upload files by socket
  var config                      = require(__dirname + '/config/config.json');
  var easyimg                     = require('easyimage');                 // crop - resize image
  var fs                          = require('fs');                        // file system access
  
  // Make an instance of socketioFileUploadServer and listen on this socket:
  var uploader = new socketioFileUploadServer();
  uploader.dir = config.tmpDir;
  uploader.listen(socket);
  
  // Do something when a file is saved:
  uploader.on('saved', function (event) {
  
      console.log('Original ' + type + ' saved');
  
      // resize and rename image with a unique id
      var newName;
  
      if (!name) {
          newName = Math.random().toString(36).substr(2, 9) + '_' + type + '.png';
      } else {
          newName = name;
      }
  
      var fileName = event.file.name.replace(/ /g, '_');
  
      easyimg.rescrop({src: config.tmpDir + fileName, dst: config.uploadDir + type + '/' + newName, width: width, height: height}, function (err, image) {
  
          if (err) return console.log(err);
  
          console.log(type + ' resized and cropped: ' + image.width + ' x ' + image.height);
  
          // image is uploaded - resized - croped, now display it
          socket.emit('display' + ucfirst(type) + 'Image', {path: '/upload/'+ type + '/' + newName});
  
          // remove original from file system
          fs.unlink(config.tmpDir + fileName, function () {
              if (err) throw err;
              console.log('Original ' + type + ' removed');
          });
  
          // additionnal action
          switch(type) {
              case 'icon':
                  // send path to generate iconset_json
                  socket.emit('setIconsetArray', {iconName: newName});
                  break;
          }
  
      });
  
  });
  
  uploader.on('start', function (event) {
      console.log('Client start upload');
      socket.emit('displayOverlay');
  });
  
  // Error handler:
  uploader.on('error', function (event) {
      console.log("Error from uploader", event);
  });
  
  };
  </code></pre>
  
  <p>Appreciate your help</p>