Code-server: 404 On files through nginx reverse proxy running code-server in a docker container

Created on 3 Mar 2020 · 13Comments · Source: cdr/code-server

Hello, I have installed code-server. It worked previously, but it has stopped working.
This is what I see in Firefox:

This is my nginx reverse proxy setup:

server {
    listen      199.192.19.234:80;
    server_name coder.diademiemi.me;

    location / {
        rewrite ^ https://$host$request_uri? permanent;
    }
}

server {
        server_name coder.diademiemi.me;
        listen 199.192.19.234:443;
        ssl on;
        ssl_certificate /etc/letsencrypt/live/diademiemi.me-0005/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/diademiemi.me-0005/privkey.pem;

        location / {
        proxy_pass http://172.17.0.2:8080;

        proxy_set_header Host $host;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection upgrade;
        proxy_set_header Accept-Encoding gzip;
        }
}

This is what I use to start code-server:

docker run -d -it --name code-server --restart always --ip 172.17.0.2 -p 8080:8080 --env-file coder.env -v "/srv/coder:/home/coder/host" -v "/home/coder/:/home/coder/" codercom/code-server \
 --disable-telemetry \
docker exec -it code-server sudo /usr/bin/apt -y update
docker exec -it code-server sudo /usr/bin/apt -y update --fix-missing
docker exec -it code-server sudo /usr/bin/apt -y install cmake default-jre python3 python3-pip nodejs zsh git

Is this a bug? How can I fix this? it used to work

bug

Source

diademiemi

Most helpful comment

Ohhh, I think I see what's going on. code-server makes all requests
against the base, so if you need the requests to go against some other
path then you'll need to rewrite the URL.

For nginx I think adding a trailing slash on proxy_pass should do it.
For example: proxy_pass http://localhost:8080/;.

code-asher on 23 Mar 2020

👍3 ❤2 🎉2

All 13 comments

Hm weird. It worked on previous versions?

Can you try clearing your cache?

kylecarbs on 3 Mar 2020

I don't think I updated anything in this time. Maybe I did and forgot though.
I have cleared cache, tried other devices as well. Didn't help. I just tried and it also does not work on Chromium

diademiemi on 3 Mar 2020

Also, this happens after I log in, the login page loads fine.

diademiemi on 3 Mar 2020

I'm no expert with nginx (so bear with me), but it seems maybe nested paths are failing to load?

kylecarbs on 3 Mar 2020

That's odd; those files don't exist in the production build (they get
bundled into the larger workbench files).

code-asher on 3 Mar 2020

It loads fine when just accessing it normally, but once I try to access it via a nginx as a reverse proxy (which would be preferred greatly because of easy HTTPS and a subdomain) it does this. Is there anything I can try to fix this?

diademiemi on 3 Mar 2020

It might be worth trying out the 3.0.0 Docker tag to see if that helps at all. I'm not sure what it could be if it works directly but not through the proxy except for the browser cache, but you mentioned you already cleared that.

code-asher on 5 Mar 2020

Following on #1428, I tried v3.0.1 and I'm having the same issue. For some reason, code-server will add parent dir to path which I suspect to be the issue. For instance if I access http://localhost/my-project/, I get:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
    />
    <meta http-equiv="Content-Security-Policy" content="style-src 'self'; manifest-src 'self'; img-src 'self' data:;" />
    <title>404 - code-server</title>
    <link rel="icon" href="./../static/0b9a478289e6f15c2ab1f9345e3ece7b2eb29180/src/browser/media/favicon.ico" type="image/x-icon" />
    <link
      rel="manifest"
      href="./../static/0b9a478289e6f15c2ab1f9345e3ece7b2eb29180/src/browser/media/manifest.json"
      crossorigin="use-credentials"
    />
    <link rel="apple-touch-icon" href="./../static/0b9a478289e6f15c2ab1f9345e3ece7b2eb29180/src/browser/media/code-server.png" />
    <link href="./../static/0b9a478289e6f15c2ab1f9345e3ece7b2eb29180/dist/pages/app.css" rel="stylesheet" />
    <meta id="coder-options" data-settings='{"base":"./..","commit":"0b9a478289e6f15c2ab1f9345e3ece7b2eb29180","logLevel":2}' />
  </head>
  <body>
    <div class="center-container">
      <div class="error-display">
        <h2 class="header">404</h2>
        <div class="body">
          Not found
        </div>
        <div class="links">
          <a class="link" href="./../dashboard">go home</a>
        </div>
      </div>
    </div>
    <script src="./../static/0b9a478289e6f15c2ab1f9345e3ece7b2eb29180/dist/register.js"></script>
  </body>
</html>

mahmoudajawad on 20 Mar 2020

Ohhh, I think I see what's going on. code-server makes all requests
against the base, so if you need the requests to go against some other
path then you'll need to rewrite the URL.

For nginx I think adding a trailing slash on proxy_pass should do it.
For example: proxy_pass http://localhost:8080/;.

code-asher on 23 Mar 2020

👍3 ❤2 🎉2

@code-asher, yup! I can confirm this works. And, I thought I have tested all the possible combinations reverse proxy settings in nginx. Thanks a lot!

mahmoudajawad on 25 Mar 2020

🎉1

🎉

nhooyr on 26 Mar 2020

I have the trailing slash already within my NGINX config file
proxy_pass http://127.0.0.1:8080/;
But I'm having the same issue with vscode-remote-resource
https://dev.mydomain.com/vscode-remote-resource?path=%5Cusr%5Clib%5Ccode-server%5Clib%5Cvscode%5Cextensions%5Ctheme-seti%5Cicons%5Cseti.woff&tkn=
CodeServer01