Configuration Webserver Apache/Nginx

Hello,

there is a good example to configure the Webserver Nginx in this forum.

If I use Nginx everything works fine with this. But for some reasons i want to use Apache as webserver.
After hours of failed configurations i want to ask the community for help.

Here is my configuration:

<VirtualHost :80>
ServerName openems.example.com
DocumentRoot /var/www/openems/
RewriteEngine on
<Location “/websocket/”>
RewriteCond ${HTTP:Upgrade} websocket [NC]
RewriteCond ${HTTP:Connection} upgrade [NC]
RewriteRule .
“ws://127.0.0.1:8085/$1” [P,L]
ProxyPass ws://127.0.0.1:8085/

ErrorLog “/var/log/openems/error.log”
CustomLog “/var/log/openems/access.log” common

The port of the websocket is configured as default value 8085 and the browser console log is:

WebSocket connection to ‘ws://openems.example.com/websocket’ failed: Error during WebSocket handshake: Unexpected response code: 404

Any ideas?

Greetings
Christian

OpenEMS UI is built on Angular, so any documentation on deploying Angular should work. I am not very experienced with Apache, but this guide looks quite complete:

Hi Bilal,

please be aware that this is a Community board and answers by volunteers can sometimes take a while. Especially if questions are hard to answer like in your case.

Please write your problem as detailed as possible in the original thread. Also I see that you were able to run the UI on your Raspberry Pi. Could you document what the problem was, for future users? Thanks!

Hello Christian,

for those reasons I’m using Apache as well :wink:

I’m gonna paste my working Apache config down below. But first I would like to tell you how I got there. First I was using OpenEMS UI with plain HTTP (unencrypted), just like your Apache config snippet implies. In that use case I did not use Apache as Proxy for the websocket connection of the UI at all, but directly entered the corresponding WS URL into the UI environment file.

Later I wanted to use HTTPS to connect my browser to my UI. I’m planning to switch my backend from Metadata_Dummy to Metadata_File while I’m working on a MR to add some simple user-auth to Metadata_File. That’s because while being a big Odoo fanboy, I see that there is going to be smaller deployments which don’t account for a full Odoo instance just for backend Edge/User auth.

So for HTTPS I had to find a solution to have websocket use HTTPS as well (AFAIK browsers would not accept otherwise). So I was trying to setup Apache to act as HTTPS endpoint for the websocket connection and proxy this to the websocket endpoint. I did have a bit of a struggle, most of all because of some general misconceptions of mine about websocket in general. Finally I made it with close to zero configuration effort, as with apache there is a module mod_proxy_wstunnel. When enabling this module, proxy for websocket will work magically without much further work. The one thing that kept me struggling for hours was that testing this wstunnel won’t work by entering the websocket URL into your browser address bar, as your browser then would not issue a websocket request, which then results in a very misleading error message in your Apache error log. Finally when I realized that, I just gave OpenEMS UI a go and it worked.

So finally here is my working apache config, and remember you need module proxy_wstunnel enabled along with those other proxy modules needed. And remember, you will want the “ErrorDocument …” Line in your config :wink:

 <VirtualHost _default_:443>
                ServerAdmin webmaster@localhost

                DocumentRoot /opt/openems-ui
                ErrorDocument 404 /index.html

                ProxyPass /openems-backend-ui ws://localhost:8082/
                ProxyPassReverse /openems-backend-ui ws://localhost:8082/

                # Available loglevels: trace8, ..., trace1, debug, info, notice, warn,
                # error, crit, alert, emerg.
                # It is also possible to configure the loglevel for particular
                # modules, e.g.
                #LogLevel info ssl:warn

                ErrorLog ${APACHE_LOG_DIR}/error.log
                CustomLog ${APACHE_LOG_DIR}/access.log combined

                ... all the SSL stuff ...

                <Directory /opt/openems-ui>
                        Options Indexes FollowSymLinks
                        AllowOverride None
                        Require all granted
                </Directory>

        </VirtualHost>
2 Likes

Hi topro,

this worked for me after seconds :hugs:

Thank you very much!

1 Like