Running VS Code Server with Apache2 Proxy #96

nvima · 2021-09-29T16:35:58Z

nvima
Sep 29, 2021

Hey,
I would like to use VSCode Server with Apache2 to get access to it via a domain and to secure the site with htacces password.
When I call the server via IP: PORT, everything works fine.
When I access it via the domain, I see VSCode in the background, but with the error message "The workbench failed to connect to the server (Error: WebSocket close with status code 1006)".

My Apache Config looks like this.

<VirtualHost *:80>
        ServerName **Here is my domain**
        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined

        ProxyRequests Off
        <Proxy *>
          Order deny,allow
          Allow from all
        </Proxy>

        ProxyPass / http://0.0.0.0:3000/
        ProxyPassReverse / http://0.0.0.0:3000/

        <Location />
          Order allow,deny
          Allow from all
        </Location>

   </VirtualHost>

Do I have to forward an additional port for the websocket service or something like this?

Answered by Complexicon

Sep 29, 2021

Hey i set openvscode up today at my workplace and you need to add a websocket proxy to your apache config then it should work fine.

this is the config i use

<VirtualHost *:443>
        ServerName <your-vhost-domain>

        <Location />
                AuthType Basic
                AuthName "VSCode Login"
                AuthUserFile "/etc/apache2/htpasswd"
                Require valid-user
        </Location>

        SSLEngine on
        SSLCertificateFile "/etc/apache2/ssl_certificate.pem"
        SSLCertificateKeyFile "/etc/apache2/ssl_certificate_key.pem"

        RewriteEngine on
        RewriteCond %{HTTP:Upgrade} websocket [NC]
        RewriteCond %{HTTP:Connection} upgrade [NC…

View full answer

Complexicon · 2021-09-29T17:34:48Z

Complexicon
Sep 29, 2021

Hey i set openvscode up today at my workplace and you need to add a websocket proxy to your apache config then it should work fine.

this is the config i use

<VirtualHost *:443>
        ServerName <your-vhost-domain>

        <Location />
                AuthType Basic
                AuthName "VSCode Login"
                AuthUserFile "/etc/apache2/htpasswd"
                Require valid-user
        </Location>

        SSLEngine on
        SSLCertificateFile "/etc/apache2/ssl_certificate.pem"
        SSLCertificateKeyFile "/etc/apache2/ssl_certificate_key.pem"

        RewriteEngine on
        RewriteCond %{HTTP:Upgrade} websocket [NC]
        RewriteCond %{HTTP:Connection} upgrade [NC]
        RewriteRule ^/?(.*) "ws://localhost:6700/$1" [P,L]

        ProxyRequests On
        ProxyPass / http://localhost:6700/
        ProxyPassReverse / http://localhost:6700/

</VirtualHost>

also make sure that you have the proxy_wstunnel apache module enabled.

7 replies

nvima Sep 30, 2021
Author

Mhhh, I installed all needed mods. and activated ssl and used your config.
My apache is version 2.4.38, via apt update is everything up 2 date and im not rly sure in updating apache manuelly.
i think the error must be with apache, because I can acces vscode over the ip.
I tryd every apache config i found on google for websocket + http proxy + https :(

The Vscode server also respond with this:
failed to upgrade for header "WebSocket" and url: "/?reconnectionToken=f6790f70-324c-4458-8a4f-b270fdc008f8&reconnection=false&skipWebSocketFrames=false".

nvima Sep 30, 2021
Author

Okay, now i'm totally confused
when i visit my subdomain with an port like dev.domain:3000, everything works.
Is that how it should work? or do i just skip the apache part with the port? Because it doesnt work with https only http, and i dont have http setting only https in apache.

WarDrake Sep 30, 2021

It works with HTTPS as well, it's just apache 2.4.38 that doesn't work, I spent a couple hours yesterday playing with this to no avail until I updated apache
Here's my config

<VirtualHost *:80>
        ServerName vscode.example.com
        Redirect / https://vscode.example.com/
</VirtualHost>
<VirtualHost *:443>
        ServerName vscode.example.com

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

        ProxyRequests Off

        <Location />
                AuthType Basic
                AuthName "Please Login"
                AuthUserFile /etc/apache2/.htpasswd
                Require user wardrake
                ProxyPreserveHost On
                ProxyPass http://localhost:3000/
                ProxyPassReverse http://localhost:3000/
        </Location>

        SSLCertificateFile /etc/letsencrypt/live/example.com/fullchain.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
        Include /etc/letsencrypt/options-ssl-apache.conf
        SSLCertificateChainFile /etc/letsencrypt/live/example.com/chain.pem

        ErrorLog ${APACHE_LOG_DIR}/vscode.error_log
        CustomLog ${APACHE_LOG_DIR}/vscode.access_log combined
</VirtualHost>

it uses a permanent redirect from http to https
reverse proxy basic auth with https

however, apache 2.4.38 as in debian buster's apache does not work, you need to use the backports and update to apache 2.4.48

sudo apt install apache2/buster-backports

nvima Sep 30, 2021
Author

Thx this helped solving my problem :)

starmadegeek Oct 1, 2021

Thanks man. This solved everything for my remote WS.

Verhoeckx · 2021-12-30T13:02:13Z

Verhoeckx
Dec 30, 2021

What I do not understand:
When you run the container, when is Apache being used? Everything goes directly to the container or not?

Or you run it on port 443 (Apache) and then proxy it to port 3000 (Docker)?

In my case port 443 isn't being used (it's behind a proxy with SSL-offloading) and port 80 is being used by Laravel.
How can I configure websockets then?

It's about my issue here:
#278

4 replies

WarDrake Dec 30, 2021

You just need to setup a vhost in apache for this.
apache proxies the connection to the 3000 port from 443,

        ServerName vscode.example.com
        Redirect / https://vscode.example.com/
</VirtualHost>
<VirtualHost *:443>
        ServerName vscode.example.com

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

        ProxyRequests Off

        <Location />
                AuthType Basic
                AuthName "Please Login"
                AuthUserFile /etc/apache2/.htpasswd
                Require user wardrake
                ProxyPreserveHost On
                ProxyPass http://localhost:3000/
                ProxyPassReverse http://localhost:3000/
        </Location>

        SSLCertificateFile /etc/letsencrypt/live/example.com/fullchain.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
        Include /etc/letsencrypt/options-ssl-apache.conf
        SSLCertificateChainFile /etc/letsencrypt/live/example.com/chain.pem

        ErrorLog ${APACHE_LOG_DIR}/vscode.error_log
        CustomLog ${APACHE_LOG_DIR}/vscode.access_log combined
</VirtualHost>```

Verhoeckx Dec 30, 2021

Thanks, but then it's not possible anymore to access the Larevel website with port 443.
And I don't see a difference with my setup in which I proxy the traffic from port 3000 on the host to port 3000 in the virtual machine.

Or did you mean something else?

Sorry, my setup is just different than the one described here. I proxy from the host to a vm, and in the vm I want to be able to run a website and run OpenVSCode.

WarDrake Dec 30, 2021

you can have hundreds of sites assigned to a single port, so long as they all run on the same apache server.
I recommend you read up on "VirtualHosts"

Verhoeckx Dec 30, 2021

I do use VirtualHosts:

On the host

<VirtualHost *:80 >
    ServerName [your.domain.com]
    RewriteEngine on
    RewriteCond %{SERVER_NAME} =[your.domain.com]
    RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=permanent]
</VirtualHost>

<VirtualHost *:443 >
    ServerName [your.domain.com]
    ProxyPreserveHost On
    ProxyPass / http://[IP address virtual machine]/
    ProxyPassReverse / http://[IP address virtual machine]/
    SSLEngine on
</VirtualHost>

<VirtualHost *:3000 >
    ServerName [your.domain.com]
    
    RewriteEngine On
    RewriteCond %{HTTP:Connection} Upgrade [NC]
    RewriteCond %{HTTP:Upgrade} websocket [NC] 
    RewriteRule /(.*) ws://[IP address virtual machine]:3000/$1 [P,L]
    
    ProxyPreserveHost On
    ProxyPass / http://[IP address virtual machine]:3000/
    ProxyPassReverse / http://[IP address virtual machine]:3000/
    
    SSLCertificateFile /etc/letsencrypt/live/[your.domain.com]/fullchain.pem
    SSLCertificateKeyFile /etc/letsencrypt/live/[your.domain.com]/privkey.pem
    Include /etc/letsencrypt/options-ssl-apache.conf
    SSLEngine on
</VirtualHost>

And in the virtual machine

ServerName localhost

<VirtualHost *:80>
       ServerName [your.domain.com]
       DocumentRoot /var/www/html/public
</VirtualHost>

The VirtualHost file in the virtual machine is only used by Laravel (a PHP framework).

You can find an image of my setup here: #278

My setup is a little bit more complicated because I proxy from the host to the virtual machine, and on the virtual machine I want to use Laravel and OpenVSCode.

starmadegeek · 2022-02-04T18:20:11Z

starmadegeek
Feb 4, 2022

Has anyone figured out how to implement the new secure token functionality on their VS Servers behind apache2 proxy?

5 replies

Verhoeckx Feb 4, 2022

The token functionality works just fine behind a reverse proxy.

sudo podman run --rm --detach --name openvscode --init -p 3000:3000 -v "$(pwd):/var/www/html:cached" gitpod/openvscode-server --connection-token [security token]

starmadegeek Feb 5, 2022

Sorry, tis might be a lame question, but how do you authenticate a user using it?
I'm running vscode server on port 3000 and the apache2 config is pointing to it if the url is vscode.[mydomain.com].
(using the config mentioned above..

        ServerName vscode.example.com
        RewriteEngine On
        RewriteCond %{HTTP:Connection} Upgrade [NC]
        RewriteCond %{HTTP:Upgrade} websocket [NC]
        RewriteRule /(.*) ws://localhost:3000/$1 [P,L]
        ProxyRequests Off
        <Location />
                AuthType Basic
                AuthName "Please Login"
                AuthUserFile /etc/apache2/.htpasswd
                Require user wardrake
                ProxyPreserveHost On
                ProxyPass http://localhost:3000/
                ProxyPassReverse http://localhost:3000/
        </Location>

)
So how to verify if someone accesing the url is me. I want to run VSCode with a custom token and let the service be accesible only if this token is entered somewhere. Is this possible?
Edit: So I was searching google and found out that I need to implement an auth screen for the VSCode service to be served. Any idea how to do it?
Thanks!

WarDrake Feb 5, 2022

you need a htpassword file, here's the documentation about it
https://httpd.apache.org/docs/2.4/programs/htpasswd.html

in the example you're using the user is "wardrake" you can change that for your own user and generate a password in the pw file for it

starmadegeek Feb 5, 2022

Yes. I got all of that worked out and running it fine untill the secure-tokens are implemented. Now, each time I wanted to access the server, I need to pass that token, like https://vscode.[mydomain.com]/?tkn=[secure-token].
Is there any workaround to make simply https://vscode.[mydomain.com] point to server after authentication? Or use that secure-token funtionality to authenticate somehow and remove the htpasswd apache basic auth completely?

jeanp413 Feb 8, 2022
Maintainer

@starmadegeek latest stable version of openvscode-server uses --without-connection-token by default so no token is required

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Running VS Code Server with Apache2 Proxy #96

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 3 comments 16 replies

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

Select a reply

Running VS Code Server with Apache2 Proxy #96

Replies: 3 comments · 16 replies

nvima Sep 30, 2021 Author

nvima Sep 30, 2021 Author

nvima Sep 30, 2021 Author

jeanp413 Feb 8, 2022 Maintainer

Replies: 3 comments 16 replies

nvima Sep 30, 2021
Author

nvima Sep 30, 2021
Author

nvima Sep 30, 2021
Author

jeanp413 Feb 8, 2022
Maintainer