vscode远程连接服务器+Xming：图形化界面

背景
用本地电脑连接服务器跑代码，服务器运行出现图形化的界面（例如plt.show()是一张图片），本地电脑端显示不出来。因此，我们利用Xming解决这个问题。

1. 主要步骤

主要步骤参考：link

1. 查看ipconfig命令查看本地电脑ip地址。注意是第一个IPv4地址而不是第二个：
   
   可以看到，第一个ip地址的网段172.18.xx.xx跟服务器的ip地址网段是相同的，这样才能保证连通性（双方都能ping通）。

2. 找到服务器中的sshd_config文件。步骤：Vscode中File→Open File，选择路径：/etc/ssh/sshd_config
   
   查看端口号：
   

3. 在本地，C:\Users\用户名.ssh\config中添加如下3行，注意Port端口号就是刚刚上面查看到的，HostName是远程服务器的ip：
   

4. 在本地安装Xming
   从网上找到Xming的下载链接下载后一路默认安装，安装完成后找到Xming的安装地址，找到X0.hosts文件：
   
   在localhost下一行添加你的服务器IP（注意是服务器ip，不是本地主机ip）：
   

5. 在服务器要使用GUI的工程中设置.vscode/launch.json (使得工程中的程序能使用GUI)：在.vscode/launch.json尾部添加红框内代码，如果已有env属性，则在里面添加"DISPLAY":“localhost:10.0"就可
   
   注意：这里不能用"DISPLAY”:“172.18.1xx.xx:0.0”，一定要用localhost

6. 在远程服务器terminal中输入两条命令：

export DISPLAY="localhost:10.0"
echo $DISPLAY

显示localhost:10.0则成功。

【如果想要永久地使用这个环境变量，那么修改你远程电脑的环境变量】先打开.bashrc：

sudo vim ~/.bashrc

在里面加入如下的代码：

export DISPLAY="192.168.137.1:0.0"

然后再执行：

source ~/.bashrc

7. 注意本地VScode上面得下载Remote X11（SSH）插件，远程服务器上面得下载Remote X11插件：
   

8. 一切都设置好了，用一段代码来测试是否成功：

import matplotlib.pyplot as plt
import numpy as np
from mpl_toolkits.mplot3d import Axes3D
ax = plt.axes(projection='3d')
ax.scatter(np.random.rand(10),np.random.rand(10),np.random.rand(10))
plt.show()

显示：

也可以在terminal中输入xclock，运行成功后的界面：

大功告成！

2. 踩过的坑

1. .vscode/launch.json在里面添加"DISPLAY":“localhost:10.0”，而不是"DISPLAY":“172.18.1xx.xx:0.0”，172.18.1xx.xx是本地主机ip地址。这个坑让我调试了好久~

基本上一些报错都是由于这个原因导致的，附上几个报错截图：

2. 本地主机ip地址搞错，刚开始用的是10.25.xx.xx，但是服务器ip地址是172.18.xx.xx，两者网段不一样，无法成功连接。

最后，按照上面的步骤严格执行，注意几个踩坑点，大概率会成功。如果不成功，就重启vscode和xming，再次运行即可！

报错：Failed to get DISPLAY: Error: Timed out while waiting for handshake
查了说是识别的端口有错。

1. 先Ctrl+Shift+P 打开命令面板输入Preferences: Open Settings (JSON)，选框出来那个：
   
2. 在里面加上remoteX11.SSH.port和remoteX11.SSH.host：
   
   再按照之前的步骤试试