NodeJS, React on Heroku, Socket.io gives error

Question

Help pls! I am making a website with Node/Express and React on Heroku. Server.js serves an expresshandlebar template on client side, rendering App.js

So far everything was working, until I tried to implement Socket.IO. Socket.IO works perfectly on localhost but gives an error on Heroku:

VM63:35 WebSocket connection to 'ws://mysite:8080/socket.io-client/?EIO=3&transport=websocket' failed: Error during WebSocket handshake: net::ERR_CONNECTION_RESET

Here is the relevant portion of the code:

Server.js

var express = require('express'),
var port = process.env.PORT || 8080;
var httpServer = require('http').createServer(app);
httpServer.listen(port)
io.on('connection', function (socket) {
console.log('Connection started');});

App.js

var io = require('socket.io-client');
var new_socket = io.connect();

I have read many sites, and tried many alternatives, such as: 1) setting on both client and server socket.io 'path' and 'transports'

path: '/socket.io-client'
transports: ['websocket']

2) Trying WebSockets as recommended by Heroku. This throws another error 'error 503'

HuyTran HuyTran · Accepted Answer · 2017-07-07T04:11:21

this.io = socket.connect(yourpath, {
  transports: ['websocket'],
  upgrade: false,
});

First, you need to connect to exactly socket server. Could you try above code, I'm using that for my project

NodeJS, React on Heroku, Socket.io gives error

1 Answers