VS code remote x11 cant get DISPLAY while connecting to remote server

Question

I use Windows VS code and this extensions "Remote SSH", "Remote X11", "Remote X11 (SSH)" to connect and to get graphics from remote server.

I run VcXsrv, Pageant. X11 forwarding works if I connect with Pageant directly. It even works in VS code terminal if I set "export DISPLAY=localhost:10.0" in remote server. So all works besides Remote X11, it cant set DISPLAY variable, with this log: Failed to get DISPLAY: Error: Invalid cygwin unix socket path

Answer 1

Reproduced from zhuanlan.zhihu.com see comment above. Basically, all we need to know is that on the server side (mostly are Linux OSs), they use X11 protocol to display GUI.

IMHO, the X11 protocol is consists of two parts, the XServer and the XClient. XServer is the one who actually draws the pixels on display equipment, while the XClient takes charge of processing the logics behind displaying.

To show GUI from remote server, we need to use a tech called X11 Forwarding, which means forwarding the remote XClient's stuff to the XServer that runs on the local machine.

1. VS Code Configuration Step 1.1: Install VS Code Step 1.2: Install Remote-SSH plugin

2. Client Machine Configuration (Windows) Step 2.1: Modify config file The config file is used by SSH. It locates at C:\Users\[user]\.ssh\config, where [user] should be your username.

To establish a key-based SSH connection, you should specify the path of key file. What's more, to enable X11 Forwarding, the following two lines should be added to config file:

ForwardX11 yes
ForwardX11Trusted yes

example of config file

Step 2.2: Download & install VcXsrv Download VcXsrv from here: VcXsrv Windows X Server download | SourceForge.net

After the installation, the following software should appear in your Menus. This is exactly the XServer we need.

3. Server Machine Configuration (Ubuntu) Remember to copy your public key into the authorized_keys on your server machine if you configure a key-based SSH connection.

Step 3.1: Get $DISPLAY Usually, the $DISPLAY variable is set by default. So, type the following command in your server's terminal, and it will output something in the form of IP:D.S. Remember the D's value, which is 10 here.

> echo $DISPLAY
localhost:10.0

If the output is blank, you should set the $DISPLAY value by yourself.

export DISPLAY=localhost:10.0 

4. Workflow / Pipeline Step 4.1: Run VcXsrv Display number should be the value you get from Step 3.1, here I set it as 10.

Tick Disable access control

There should be an 'X' icon on your task bar when you run the software successfully.

Step 4.2: Run VS Code & connect to the server Check the value of $DISPLAY, it should be consistent with your before setting.

Then type the command:

xeyes

If the GUI of two eyes shows up, it means you make it!

Step 4.3: Test your own GUI program (optional) You can even run your self-written GUI, pretty cool huh?

Answer 2

I found the solution to this here https://github.com/microsoft/vscode-remote-release/issues/4600. I am summarizing the steps here, since the steps are not very clear there. Before you start make sure you have one of the recent versions of VScode (I am using 1.55.2).

Steps to connect from Windows to Linux:

1. Install Xming (Should also work with VcXsrv). Start Xming (Default Display:0.0)
2. Install Remote-SSH. You don't need the other extensions. Nor do you need a running terminal with active x11 connection.
3. Add a new environment variable to Windows: DISPLAY = localhost:0.0 (Adjust this according to your Xming setting. I prefer the default value).
4. Connect remotely using VScode. Make sure that the ssh config forwards x11 connection: ForwardAgent yes ForwardX11 yes ForwardX11Trusted yes You can actually check the logs of remote host, if x11 forwarding is successful and port is set. If not set properly, it will complain that the display is not set. An easier check is to see if the DISPLAY variable is automatically set in the Linux server.

Hopefully everything works after these steps.