title: Socket.IO connection in React causes continuous reloads
body: <p>I've never had this problem before and can't seem to figure out what is causing it. I'm working on a project with an Express &amp; Socket.io back end and a React front end (using create-react-app).</p>
  
  <p><em>server/index.js...</em></p>
  
  <p>Pretty standard and to my knowledge should work...</p>
  
  <pre class="lang-js prettyprint-override"><code>const app = express();
  const server = app.listen(config.port);
  io.attach(server);
  
  if (process.env.NODE_ENV === 'production') {
    app.use(express.static(path.join(__dirname, '..', 'build')));
    app.get('/', (req, res) =&gt; res.sendFile(path.join(__dirname, '..', 'build', 'index.html')));
  }
  
  io.on('connection', socket =&gt; {
    *blah blah blah*
  });
  </code></pre>
  
  <p><em>src/index.js...</em></p>
  
  <pre class="lang-js prettyprint-override"><code>class App extends Component {
    constructor(props) {
      super(props);
      this.socket = io.connect(window.location);
    }
  
    render = () =&gt; {
      if (view === 'start') {
        return &lt;StartContainer socket={this.socket} /&gt;;
      } else if (view === 'game') {
        return &lt;Game socket={this.socket} /&gt;;
      }
    }
  }
  </code></pre>
  
  <p>I'm actually in the process of testing deployment so I've been running <code>set NODE_ENV=production&amp;&amp; node server/index.js</code> to test the file serving in the Express app.</p>
  
  <p>In development, I run two servers: one with create-react-app and another for the Express &amp; Socket.io server. This issue doesn't occur in development.</p>
  
  <p>So, I start up the server, go to localhost and the page keeps refreshing. If I remove the socket connection from <code>App</code> the issue goes away. Hopefully I'm not overlooking something super simple here. Any help is appreciated.</p>
  
  <p>I left out some of the App component for the sake of brevity but if you suspect the issue may be elsewhere please let me know and I'll add more of it.</p>
  
  <p><strong>EDIT</strong> The issue is definitely on the client. I <a href="https://www.npmjs.com/package/serve" rel="nofollow noreferrer">served</a> the built React project and have same issue.</p>