Code-server: Blank Page after Login with HTTPS

[s94285]

• code-server version: 2.1650-vsc1.39.2
• OS Version: Ubuntu 16.04 under Windows 10 subsystem of Linux

Description

I got a blank screen after login with HTTPS enabled, but everything works well without HTTPS.

Steps to Reproduce

Command :
~/code-server2.1650-vsc1.39.2-linux-x86_64/code-server --host 192.168.2.200 --port 20080 --cert /etc/letsencrypt/live/s94285vscode.ddns.net/fullchain.pem --cert-key /etc/letsencrypt/live/s94285vscode.ddns.net/privkey.pem --verbose -s --log trace

Output :
info Server listening on https://192.168.2.200:20080
info - Password is fa7271ff44002589737f939e
info - To use your own password, set the PASSWORD environment variable
info - To disable use --auth none
info - Using provided certificate and key for HTTPS

Then open browser and login.

Trace from Chrome's console

workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][initial][s94285vscode.ddns.net:80] 1/6. invoking socketFactory.connect().
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][initial][s94285vscode.ddns.net:80] 2/6. socketFactory.connect() was successful.
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][initial][s94285vscode.ddns.net:80] 3/6. sending AuthRequest control message.
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][initial][s94285vscode.ddns.net:80] 4/6. received SignRequest control message.
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][initial][s94285vscode.ddns.net:80] 5/6. sending ConnectionTypeRequest control message.
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][initial][s94285vscode.ddns.net:80] 6/6. handshake finished, connection is up and running after 563 ms!
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] starting reconnecting loop. You can get more information with the trace log level.
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] waiting for 5 seconds before reconnecting...
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] resolving connection...
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] connecting to s94285vscode.ddns.net:80...
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][reconnect][s94285vscode.ddns.net:80] 1/6. invoking socketFactory.connect().
workbench.web.api.js:1605 WebSocket connection to 'wss://s94285vscode.ddns.net/?reconnectionToken=813ed4cd-4e00-4373-8169-decf8b45ce94&reconnection=true&skipWebSocketFrames=false' failed: WebSocket opening handshake timed out
create @ workbench.web.api.js:1605
connect @ workbench.web.api.js:1606
(anonymous) @ workbench.web.api.js:1606
d @ workbench.web.api.js:1606
h @ workbench.web.api.js:1608
u @ workbench.web.api.js:1609
_reconnect @ workbench.web.api.js:1615
_runReconnectingLoop @ workbench.web.api.js:1613
workbench.web.api.js:1460 ERR [remote-connection][Management ][813ed…][reconnect][s94285vscode.ddns.net:80] socketFactory.connect() failed. Error:
workbench.web.api.js:1460 ERR Error: WebSocket close with status code 1006
at WebSocket. (workbench.web.api.js:1605)
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] A temporarily not available error occured while trying to reconnect, will try again...
workbench.web.api.js:1460 TRACE Error: WebSocket close with status code 1006
at WebSocket. (workbench.web.api.js:1605)
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] waiting for 5 seconds before reconnecting...
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] resolving connection...
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] connecting to s94285vscode.ddns.net:80...
workbench.web.api.js:1460 TRACE [remote-connection][Management ][813ed…][reconnect][s94285vscode.ddns.net:80] 1/6. invoking socketFactory.connect().
workbench.web.api.js:1460 ERR [remote-connection] The time limit has been reached for a connection. Error:
workbench.web.api.js:1460 ERR Error: Time limit reached
at workbench.web.api.js:1615
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] A network error occured while trying to reconnect, will try again...
workbench.web.api.js:1460 TRACE Error: Time limit reached
at workbench.web.api.js:1615
workbench.web.api.js:1460 INFO [remote-connection][Management ][813ed…][reconnect] waiting for 10 seconds before reconnecting...

[sr229]

I can't confirm this, is this WSL1 or WSL2?

[s94285]

@sr229 Thanks for replying.
It's on WSL1. I'll try WSL2 later.

[s94285]

@sr229 I'd like to try WSL2 but it is incompatible with vmware.
So I'll just stick to WSL1. If the problem is caused by WSL1, I'll run it on virtual machine. Thanks.

[s94285]

@sr229 Here's the error that shows on chrome's console:
Uncaught TypeError: Cannot read property 'hasPendingUpdate' of undefined at p.get hasPendingUpdate [as hasPendingUpdate] (workbench.web.api.js:sourcemap:1627) at workbench.web.api.js:sourcemap:1627
Then reconnect loop started. Each retry get this error:
workbench.web.api.js:sourcemap:1605 WebSocket connection to 'wss://s94285vscode.ddns.net/?reconnectionToken=efd1aceb-a767-4e75-af4c-5fb90c4f92e0&reconnection=true&skipWebSocketFrames=false' failed: WebSocket opening handshake timed out

[code-asher]

The biggest difference between HTTPS and HTTP is that code-server has to create a proxy socket which is then passed to the extension host (since TLS sockets cannot be passed to other processes). This uses net.createServer and net.connect on ${os.tmpdir()}/code-server/tls-proxy.

I'm not very familiar with WSL but maybe it has something to do with that.

[sr229]

I think this is something to do with WSL1's networking AFAIK, WSL2 uses a virtual switch which should handle HTTPS properly. This may be a WSL issue.

[Shadowist]

I get the same with Safari in iPadOS 13.2 (17B84) now. However, Safari in macOS 10.15.1 works okay in my network.

Edit: http works okay as well.

[ghost]

Same issue here.
If i run code-server over http everything works fine. I can login and use VSCode as expected.
if i run code-server over https, i can still login but after that the page is white.
I think it's an problem with the wss port because the

Trace from the Google Chrome Developer Console

workbench.web.api.js:147   ERR [remote-connection][Management   ][e5dc6…][initial][<ip>:80] the handshake took longer than 10 seconds. Error:

looks like the connection is establishing over port 80 on which my http server is running, that redirects to the https server. And not on 443 which is my https server on which code-server is running. This should be changed because every browser calls https:// over the port 443 by default.

[code-asher]

Ah you can ignore the 80 in that message. You should be able to see the real connection endpoint in the network tab. VS Code tries to connect over a port and we override it to use the current URL but it's not updated in that message.

[nhooyr]

If this is still a problem, please feel free to reopen.

[clsx524]

i still see the same issue. I installed it with traefik to provide SSL on Ubuntu 19.10. Code server is running in docker with http (I did not provide the cert, instead, it’s installed with traefik). I am only able to use it on my Mac with chrome. I tried on safari (mac), safari (iOS 13.3.1), chrome (iOS 13.3.1) but they all got blank page and same error “WebSocket close with status code 1006“ as above.

Traefik.toml (ver. 1.7.20)

defaultEntryPoints = ["http", "https"]

[entryPoints]
  [entryPoints.http]
  address = ":80"
  compress = true
    [entryPoints.http.redirect]
    entryPoint = "https"

  [entryPoints.https]
  address = ":443"
    [entryPoints.https.tls]
      [entryPoints.https.tls.ClientCA]
        optional = true
      [[entryPoints.https.tls.certificates]]
        certFile = "/etc/traefik/certs/my.cert"
        keyFile = "/etc/traefik/certs/my.key"

  [entryPoints.traefik]
  address = ":8083"

Labels for code server

      traefik.backend: "code"
      traefik.frontend.rule: "Host:code.domain.com"
      traefik.enable: "true"
      traefik.port: "8080"

[nhooyr]

Not working with iOS is expected since you need a non self signed certificate but are you sure it's not working with Safari on Mac? You should see a screen explaining the situation and then you can override and connect.

[clsx524]

Not working with iOS is expected since you need a non self signed certificate but are you sure it's not working with Safari on Mac? You should see a screen explaining the situation and then you can override and connect.

Is there any way to get non self signed certificate for my local code server in a docker instance? I tried letsencrypt, but it does not take local IP address and unverified domain.

[clsx524]

i still see the same issue. I installed it with traefik to provide SSL on Ubuntu 19.10. Code server is running in docker with http (I did not provide the cert, instead, it’s installed with traefik). I am only able to use it on my Mac with chrome. I tried on safari (mac), safari (iOS 13.3.1), chrome (iOS 13.3.1) but they all got blank page and same error “WebSocket close with status code 1006“ as above.

Traefik.toml (ver. 1.7.20)

defaultEntryPoints = ["http", "https"]

[entryPoints]
  [entryPoints.http]
  address = ":80"
  compress = true
    [entryPoints.http.redirect]
    entryPoint = "https"

  [entryPoints.https]
  address = ":443"
    [entryPoints.https.tls]
      [entryPoints.https.tls.ClientCA]
        optional = true
      [[entryPoints.https.tls.certificates]]
        certFile = "/etc/traefik/certs/my.cert"
        keyFile = "/etc/traefik/certs/my.key"

  [entryPoints.traefik]
  address = ":8083"

Labels for code server

      traefik.backend: "code"
      traefik.frontend.rule: "Host:code.domain.com"
      traefik.enable: "true"
      traefik.port: "8080"

Figured out. My solution is not related to code server but still documented here for future reference

1. in traefik config, TLS can set to minimum 1.3 but I have to make sure no cypher suites are provided. Incompatible cypher suites would result in errors.
2. on cloudflare, TLS version should be set to 1.2 minimum, instead of 1.3 minimum. In this way, safari would be as least able to log wss failure, error code 401. The request is still sent with TLS 1.3 but I don't know why this config would matter (chrome does not have this problem).
3. for the error code 401, I have to disable basic auth in traefik because the authorization code is not part of the request in safari, resulting in 401. However, Chrome would be able to send authorization code. In the end, I use the authorization built with code server.

[frederickbeaulieu]

Had the same problem with Synology Reverse Proxy.

Had to set the _Proxy Http version_ to 1.0 in _Advanced Settings_

[long-ris3]

Had to set the _Proxy Http version_ to 1.0 in _Advanced Settings_

@frederickbeaulieu I still see the blank page after setting the proxy version. Did you do anything else special to make it work on Synology? I set up code-server in a Ubuntu container. It works fine on HTTP without the reverse proxy, but gets stuck at the blank page after login on HTTPS through the proxy. Thanks.

[frederickbeaulieu]

Here is my config, sorry for the delay, I just moved to a new house and the Syno was not setup yet.

Docker Image :

https://registry.hub.docker.com/r/linuxserver/code-server/

Docker config :

Reverse proxy settings :

[frederickbeaulieu]

@frederickbeaulieu I still see the blank page after setting the proxy version. Did you do anything else special to make it work on Synology? I set up code-server in a Ubuntu container. It works fine on HTTP without the reverse proxy, but gets stuck at the blank page after login on HTTPS through the proxy. Thanks.

Hope this help

[long-ris3]

@frederickbeaulieu I still see the blank page after setting the proxy version. Did you do anything else special to make it work on Synology? I set up code-server in a Ubuntu container. It works fine on HTTP without the reverse proxy, but gets stuck at the blank page after login on HTTPS through the proxy. Thanks.

Hope this help

Adding the custom headers and ticking the HSTS/HTTP2 boxes in the reverse proxy seem to have done the trick. Thanks!