Websockets not working while running Portainer with Httpd proxying

Question

I've set up the Portainer UI as a docker container, and it's working great if I connect my browser to port 9000 (as in http://foo.bar.com:9000). I can navigate around the UI and open up container consoles (which use websockets) without a problem.

But, what I need to do i connect with SSL (as in https://foo.bar.com).

I set up an httpd container on the same machine, and gave it the following configuration file:

<VirtualHost *:443>
  ServerName foo.bar.com

  ProxyPass / http://foo.bar.com:9000/
  ProxyPassReverse / http://foo.bar.com:9000/
  RequestHeader set X-Forwarded-Proto "https"

  <Location /api/websocket/>
    RewriteEngine on
    RewriteCond %{HTTP:UPGRADE} ^WebSocket$ [NC]
    RewriteCond %{HTTP:CONNECTION} Upgrade$ [NC]
    RewriteRule /api/websocket/(.*) ws://foo.bar.com:9000/api/websocket/$1 [P]
  </Location>
  
  ## SSL directives
  SSLEngine on
  SSLCertificateFile      "/usr/local/apache2/conf/server.crt"
  SSLCertificateKeyFile   "/usr/local/apache2/conf/server.key"

  ## Logging
  ServerSignature Off
  ErrorLog "logs/error_ssl.log"
  CustomLog "logs/access_ssl.log" common 

</VirtualHost>

Both httpd and portainer are being brought up by separate docker-compose.yml files.

Now, the Portainer web pages still come up just fine, but the consoles for the containers won't work. Somehow, my websocket configuration above is broken. Any ideas on what I might be doing wrong?

Answer 1

After hours of playing with it, I finally got this to work and wanted to share. First, at least in httpd 2.4, you need to explicitly load mod_proxy_wstunnel.so so make sure and put a LoadModule in. Until you do that, nothing will work.

Here is the httpd configuration that was successful:

<VirtualHost *:443>
  ServerName foo.bar.com
  ProxyPreserveHost on
  ProxyPreserveHost On
  ProxyRequests Off

  # allow for upgrading to websockets
  RewriteEngine On
  RewriteCond %{HTTP:Upgrade} =websocket [NC]
  RewriteRule ^/?(.*) ws://foo.bar.com:9000/$1 [P,L]
  RewriteCond %{HTTP:Upgrade} !=websocket [NC]
  RewriteRule ^/(.*)           http://foo.bar.com:9000/$1 [P,L]

  ProxyPass "/" "http://foo.bar.com:9000/"
  ProxyPassReverse "/" "http://foo.bar.com:9000/"

  ## SSL directives
  SSLEngine on
  SSLCertificateFile "/usr/local/apache2/conf/server.crt"
  SSLCertificateKeyFile "/usr/local/apache2/conf/server.key"

  ## Logging
  ServerSignature Off
  ErrorLog "logs/error_ssl.log"
  CustomLog "logs/access_ssl.log" common 

</VirtualHost>

Answer 2

Thanks a lot - saved me lot of trouble setting this up in Apache. I'm using it in local network only so I don't care much about https and certs so I've modified it bit to go through http

<VirtualHost *:80>
  ServerName foo.bar.com
  ServerAlias foo.bar.alias.com
  ProxyPreserveHost On
  ProxyRequests Off

  # allow for upgrading to websockets
  RewriteEngine On
  RewriteCond %{HTTP:Upgrade} =websocket [NC]
  RewriteRule ^/?(.*) ws://localhost:9000/$1 [P,L]
  RewriteCond %{HTTP:Upgrade} !=websocket [NC]
  RewriteRule ^/(.*)           http://localhost:9000/$1 [P,L]

  ProxyPass "/" "http://localhost:9000/"
  ProxyPassReverse "/" "http://localhost:9000/"

  # Logging

  ErrorLog ${APACHE_LOG_DIR}/portainer_error.log
  CustomLog ${APACHE_LOG_DIR}/portainer_access.log combined
</VirtualHost>