CODEWITHSUNDEEP
angularjsnode.jsherokularavel-5websocket
Honey Thakuria
Honey Thakuria

Reputation: 241

Not able to connect to Websockets on Heroku

I have been working on an PHP Laravel Application for which I have been using Redis and Node.JS to get connected to the WebSocket.

So in order to achieve that I have been trying to run the node server on port 3000 but heroku is dynamically allocating the port.

Because of this I am unable to get the correct port no on client side.

What should I do in order to fix it ?

Client side config :

var socket = io.connect('http://app-around.herokuapp.com:3000');
  Note: Host Name is app-around.herokuapp.com

Backend is Running Fine as shown below:

    C:\xampp\htdocs\around-us>heroku run node socket.jsRunning node 
   socket.js on app-around... up, run.5567 (Free)
    // Randomly generated port number it is..

   Message Recieved: {"event":"App\\Events\\NewMessage","data":{"data":
    {"message":"Question Posted"}},"socket":null}

So events are getting generated on the Server side but am not able to receive them on the client side. Tried several things on Front End but none of them is working:

    Eg: 1) var socket = io.connect();
        2) var socket = io.connect(window.location.hostname);

Node Server Code:

      var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var Redis = require('ioredis');
var redis = require('redis').createClient(process.env.REDIS_URL);

redis.subscribe('test-channel', function(err, count) {

});

redis.on('message', function(channel, message) {
   console.log('Message Recieved: ' + message);

    message = JSON.parse(message);

    io.emit(channel + ':' + message.event, message.data);

     var temp = "data";
    io.emit("time", temp);

});

var port = process.env.PORT || 3000;

http.listen(port, function(){
    console.log('Listening on Port 23000');
});

JS Code for the Angular app on the front end side:

var socket = io();

    socket.on("time",function(data){
            alert(data);
    });

Upvotes: 0

Views: 1719

Answers (3)

Akki
Akki

Reputation: 1

I guess issue is on your client side var socket = io.connect('http://app-around.herokuapp.com'); try this or var socket=io.connect(); I hope it will help you

Upvotes: 0

Myst
Myst

Reputation: 19221

As mentioned by Andrés, the Server should collect the port from the environment:

The development environment won't have a PORT variable, so we add a default port (you're using 3000, which is common enough).

  process.env.PORT || 3000

The Client - and I'm assuming a browser - should be able to automatically identify the target server using the HTTP URL address and connect to the correct Websocket URL and port.

I use a variation on the following code when I don't use a pre-made library (libraries often have their own URL schemes):

// websocket connects to root ("/")
var ws_url =
    document.location.origin.replace(/^http/i, "ws");
// OR web socket connects to full URL path (i.e. "/my/path")
var ws_url =
    document.location.href.replace(/^http/i, "ws");

Upvotes: 0

Andrés Andrade
Andrés Andrade

Reputation: 2223

In Node you should get the port from env vars:

server.listen(+process.env.PORT || 3000, () => {
    Logger.info(`Listening on port ${process.env.PORT || 3000}...`);
});

and in your io client you don't need to specify the port number:

io.connect('http://app-around.herokuapp.com')

Upvotes: 3

Related Questions