title: Socket.io: io.on('connection) repeats three times
body: <p>The following is an excerpt from some server side code located in the entry point of the application:</p>
  
  <pre><code>const app = express()
  const chatServer = require('http').Server(app);
  chatServer.listen(3000)
  const io = require('socket.io')(chatServer);
  
  io.on('connection', (socket) =&gt; {
    console.log('ABC')
    socket.on('send-chat-message', message =&gt; {
      socket.broadcast.emit('chat-message', message)
    })
  });
  </code></pre>
  
  <p>Upon running my dev server I expected to see 'ABC' print once to the console. However, it is printing three times (ABC, ABC, ABC) instead. Why does this happen? The io variable is NOT used anywhere else in the application. I'm pretty sure it has nothing to do with client side logic  (since no requests are made by the client at this point) And for complete reference, the entire app.js code is displayed below:</p>
  
  <pre><code>const express = require('express')
  require('./db/mongoose')
  const playerRouter = require('./routers/player')
  const contractRouter = require('./routers/contract')
  const bodyParser = require('body-parser');
  const hbs = require('express-handlebars')
  const path = require('path')
  const passport = require('passport');
  const flash = require('connect-flash');
  const session = require('express-session');
  
  // Define paths for Express config
  const viewsPath = path.join(__dirname, '../templates/views')
  const partialsPath = path.join(__dirname, '../templates/partials')
  const layoutPath = path.join(__dirname, '../templates/layouts')
  
  const app = express()
  const chatServer = require('http').Server(app);
  chatServer.listen(3000)
  const io = require('socket.io')(chatServer);
  
  // Passport Config
  require('./middleware/passport')(passport);
  
  //Setup handlebars engine and views location
  app.engine('hbs', hbs({
    extname: 'hbs',
    defaultLayout: 'main',
    layoutsDir: layoutPath,
    partialsDir: partialsPath,
  }));
  
  app.set('view engine', 'hbs')
  app.use(express.static('public'))
  app.set('views', viewsPath)
  
  io.on('connection', (socket) =&gt; {
    console.log('ABC')
    socket.on('send-chat-message', message =&gt; {
      socket.broadcast.emit('chat-message', message)
    })
  });
  
  app.use(bodyParser.urlencoded({ extended: true }));
  app.use(express.json())
  
  // Express session
  app.use(
    session({
      secret: 'secret',
      resave: true,
      saveUninitialized: true
    })
  );
  
  // Passport middleware
  app.use(passport.initialize());
  app.use(passport.session());
  
  // Connect flash
  app.use(flash());
  
  // Global variables
  app.use(function (req, res, next) {
    res.locals.success_msg = req.flash('success_msg');
    res.locals.error_msg = req.flash('error_msg');
    res.locals.error = req.flash('error');
    res.locals.currentUser = req.user
    next();
  });
  
  app.use(playerRouter)
  app.use(contractRouter)
  
  module.exports = app
  </code></pre>
  
  <p>Here is the client side code (for brevity I did not include the entire HTML file): </p>
  
  <pre><code>const socket = io('http://localhost:3000')
  const messageContainer = document.getElementById('message-container')
  const messageForm = document.getElementById('send-container')
  const messageInput = document.getElementById('message-input')
  
  socket.on('chat-message', message =&gt; {
    appendMessage(`Opponent: ${message}`)
  })
  
  
  messageForm.addEventListener('submit', e =&gt; {
    e.preventDefault()
    const message = messageInput.value
    appendMessage(`You: ${message}`)
    socket.emit('send-chat-message', message)
    messageInput.value = ''
  })
  
  const appendMessage = (message) =&gt; {
    const messageElement = document.createElement('div')
    messageElement.innerText = message
    messageContainer.append(messageElement)
  }
  </code></pre>