Setting up multiple socket.io/node.js apps on an Apache server?

I've been messing around with socket.io and node.js recently and after successfully making a chat based application, I wanted to make another similar web app. I completed it and everything was working fine when I was hosting locally on my computer, but once I put it on my web server it stopped working. Node was serving the page just fine, but the socket.io connection was not being made. This is because of how I configured my Apache proxy settings to get the previous app working. Some background on that:

When I finished the first program, I had a difficult time getting to run on the remote server. I was hosting the app on port 3000, and was trying to get apache to forward a certain URL to that port. I wanted http://example.com/app1 to essentially forward to http://example.com:3000. I got this to happen after adding ProxyPass /app1 http://localhost:3000 to Apache's configuration file, and that put me in a similar situation to what I described above. The page itself loaded fine, but no actual connection to socket.io was made. I realized the problem was that the client was looking for socket.io at the url http://example.com/socket.io. Since only the subdirectory /app1 was being forwarded to port 3000, it made sense that the client would not be able to properly connect to the server. To fix this, I added ProxyPass /socket.io http://localhost:3000/socket.io to Apache's configuration file. This essentially fixed the problem as now all requests for socket.io were being sent to the proper port.

http://example.com/app1

http://example.com:3000

ProxyPass /app1 http://localhost:3000

http://example.com/socket.io

/app1

ProxyPass /socket.io http://localhost:3000/socket.io

This worked fine for me until I wanted to set up a second application on a different port. The client for the second app had the address http://example.com/app2, which was again forward to a port on the web server, port 3001 this time, using ProxyPass /app2 http://localhost:3001. Like I described earlier, the page itself loaded fine, but the socket.io connection was not made. This new client page was again sending all socket.io requests to http://example.com/socket.io. As you would guess all of the traffic from the client page of the second app was being sent to the wrong server. I changed the port that /socket.io was being forwarded to from 3000 to 3001 allowed the second app to function properly, but now the first app has the exact same problem.

http://example.com/app2

ProxyPass /app2 http://localhost:3001

http://example.com/socket.io

/socket.io

No matter what I do, I cannot get the client pages to request for socket.io to be under the URL of the app like http://example.com/app1/socket.io. I can change the script source line in the client page to something like <script src="app1/socket.io/socket.io.js"></script> (with or without the leading '/') and it still does not work. I suppose that the problem essentially amounts to trying to find a way to run two completely separate node.js/socket.io servers simultaneously.

http://example.com/app1/socket.io

<script src="app1/socket.io/socket.io.js"></script>

TL;DR: How can I have two socket.io servers running at the same time on the same Apache server?

1 Answer
1

As you've already seen, by default socket.io initiates all connections with the same URL. Your two apps will, be default, be using the exact same URL and thus your Apache server can't tell which is which in order to proxy them differently.

So, the only way to fix that is to configure one of your socket.io installations (both client and server) to use a custom path that you can then proxypass separately from the default socket.io path.

You can set the server path when constructing the server as described here.

const server = require('http').createServer();

const io = require('socket.io')(server,
path: '/myownpath'
);

server.listen(3000);


You can set the client request path when making the connection in the client as described here.

const socket = io('http://localhost',
path: '/myownpath'
);


<script src="socket.io/socket.io.js">

<script src="/myownpath/socket.io.js">

Thanks for contributing an answer to Stack Overflow!

But avoid …

To learn more, see our tips on writing great answers.

Required, but never shown

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.