WebSockets and Apache proxy : how to configure mod_proxy_wstunnel?

I have :

1. Apache (v2.4) on port 80 of my server for www.domain1.com, with mod_proxy and mod_proxy_wstunnel enabled

2. node.js + socket.io on port 3001 of the same server.

Accessing www.domain2.com (with port 80) redirects to 2. thanks to the method described here. I have set this in the Apache configuration:

<VirtualHost *:80>
    ServerName www.domain2.com
    ProxyPass / http://localhost:3001/
    ProxyPassReverse / http://localhost:3001/
    ProxyPass / ws://localhost:3001/
    ProxyPassReverse / ws://localhost:3001/
</VirtualHost>

It works for everything, except the websocket part : ws://... are not transmitted like it should by the proxy.

When I access the page on www.domain2.com, I have:

Impossible to connect ws://www.domain2.com/socket.io/?EIO=3&transport=websocket&sid=n30rqg9AEqZIk5c9AABN.

Question: How to make Apache proxy the WebSockets as well?

I finally managed to do it, thanks to this topic.

TODO:

1) Have Apache 2.4 installed (doesn't work with 2.2), and do:

a2enmod proxy
a2enmod proxy_http
a2enmod proxy_wstunnel

2) Have nodejs running on port 3001

3) Do this in the Apache config

<VirtualHost *:80>
  ServerName www.domain2.com

  RewriteEngine On
  RewriteCond %{REQUEST_URI}  ^/socket.io            [NC]
  RewriteCond %{QUERY_STRING} transport=websocket    [NC]
  RewriteRule /(.*)           ws://localhost:3001/$1 [P,L]

  ProxyPass / http://localhost:3001/
  ProxyPassReverse / http://localhost:3001/
</VirtualHost>

Note: if you have more than one service on the same server that uses websockets, you might want to do this to separate them.

Instead of filtering by URL, you can also filter by HTTP header. This configuration will work for any web applications that use websockets, also if they are not using socket.io:

<VirtualHost *:80>
  ServerName www.domain2.com

  RewriteEngine On
  RewriteCond %{HTTP:Upgrade} =websocket [NC]
  RewriteRule /(.*)           ws://localhost:3001/$1 [P,L]
  RewriteCond %{HTTP:Upgrade} !=websocket [NC]
  RewriteRule /(.*)           http://localhost:3001/$1 [P,L]

  ProxyPassReverse / http://localhost:3001/
</VirtualHost>

May be will be useful. Just all queries send via ws to node

<VirtualHost *:80>
  ServerName www.domain2.com

  <Location "/">
    ProxyPass "ws://localhost:3001/"
  </Location>
</VirtualHost>

As of Socket.IO 1.0 (May 2014), all connections begin with an HTTP polling request (more info here). That means that in addition to forwarding WebSocket traffic, you need to forward any transport=polling HTTP requests.

The solution below should redirect all socket traffic correctly, without redirecting any other traffic.

1. Enable the following Apache2 mods:

   sudo a2enmod proxy rewrite proxy_http proxy_wstunnel
   

2. Use these settings in your *.conf file (e.g. /etc/apache2/sites-available/mysite.com.conf). I've included comments to explain each piece:

   <VirtualHost *:80>
       ServerName www.mydomain.com
   
       # Enable the rewrite engine
       # Requires: sudo a2enmod proxy rewrite proxy_http proxy_wstunnel
       # In the rules/conds, [NC] means case-insensitve, [P] means proxy
       RewriteEngine On
   
       # socket.io 1.0+ starts all connections with an HTTP polling request
       RewriteCond %{QUERY_STRING} transport=polling       [NC]
       RewriteRule /(.*)           http://localhost:3001/$1 [P]
   
       # When socket.io wants to initiate a WebSocket connection, it sends an
       # "upgrade: websocket" request that should be transferred to ws://
       RewriteCond %{HTTP:Upgrade} websocket               [NC]
       RewriteRule /(.*)           ws://localhost:3001/$1  [P]
   
       # OPTIONAL: Route all HTTP traffic at /node to port 3001
       ProxyRequests Off
       ProxyPass           /node   http://localhost:3001
       ProxyPassReverse    /node   http://localhost:3001
   </VirtualHost>
   

3. I've included an extra section for routing /node traffic that I find handy, see here for more info.