使用ssh用Cursor/TRAE/VSCode链接远程服务器并运行可视化程序,显示在本地机器上,全流程教学!

引言

++我本将心向明月,奈何明月照沟渠。++

我本来以为使用vcXsrv以及足够完成从服务器到本地的转发了,没想到还有高手!我在WSL2上使用vcXsrv和WSLg都成功了,但是在链接远程服务器时vcXsrv就失效了,而且无论如何怎么设置都无效,最后无奈只能转*++mobaXterm++*!!!

本文详细介绍了*++mobaXterm++*连接远程服务器并且在远程服务器上启动可视化程序然后在本地VSCode或者TRAE或者Cursor上面显示的全过程。更具体的说是:这将详细指导你在Windows电脑上使用VSCode通过SSH连接远程Ubuntu服务器,并配置MobaXterm运行可视化图形应用程序。可以说绝对是独一份!接下来直接------开始!

1、首先自然是安装ssh

服务器(linux系统Ubuntu),执行以下命令安装并配置ssh服务:

bash 复制代码
Types: deb
URIs: http://mirrors.tuna.tsinghua.edu.cn/ubuntu
Suites: noble noble-updates noble-backports
Components: main restricted universe multiverse
Signed-By: /usr/share/keyrings/ubuntu-archive-keyring.gpg
 
Types: deb
URIs: http://security.ubuntu.com/ubuntu/
Suites: noble-security
Components: main restricted universe multiverse
Signed-By: /usr/share/keyrings/ubuntu-archive-keyring.gpg
  • 复制该镜像源,然后执行下面命令。
cs 复制代码
apt --version    #查看apt版本
sudo cp /etc/apt/sources.list.d/ubuntu.sources /etc/apt/sources.list.d/ubuntu.sources.bak
#备份原来的源文件
vi /etc/apt/sources.list.d/ubuntu.sources    #vi打开源文件并且将镜像源复制进去
# vi 操作流程:
"""
1、打开之后切换成英文输入法,一直按键盘的 d 键逐行删除所有内容
2、按一下 i 键,切换成插入模式,然后鼠标右键点击一下,内容会直接粘贴到sources里面(其实不按i也行)
3、按一下键盘左上角的ESC键,推出插入模式进入命令模式,然后按下冒号(英文冒号:),输入 wq 然后按下回车即可

"""
  • 镜像源切换好之后,执行以下命令安装ssh。
cs 复制代码
# 1. 更新系统包列表
sudo apt update

# 2. 安装OpenSSH服务器
sudo apt install openssh-server -y

# 3. 启动SSH服务
sudo systemctl start ssh

# 4. 设置开机自启
sudo systemctl enable ssh

# 5. 检查服务状态
sudo systemctl status ssh
  • ssh安装好之后继续执行以下命令配置linux的ssh。
cs 复制代码
# 编辑SSH配置文件
sudo vi /etc/ssh/sshd_config

# 建议修改以下配置:
# Port 22                     # 修改默认端口(可选)
# PermitRootLogin no          # 禁止root登录
# PasswordAuthentication yes  # 初始配置时允许密码登录
# PubkeyAuthentication yes    # 启用密钥认证
# X11Forwarding yes           # 启用X11转发(重要!用于图形界面)
# X11DisplayOffset 10
# X11UseLocalhost yes

"""
这里进行了提前配置,方便后面直接使用X11转发功能,即这三行:
# X11Forwarding yes
# X11DisplayOffset 10
# X11UseLocalhost yes
其中X11UseLocalhost可以设置为no,X11DisplayOffset可以不配置,影响不大

上面的其他四个配置建议开启,保证服务器安全性
"""

# 重启SSH服务使配置生效
sudo systemctl restart ssh
  • 配置好ssh后,直接开始安装X11相关组件,方便后面链接。
cs 复制代码
sudo apt install xorg-x11-xauth xorg-x11-fonts-* xorg-x11-font-utils xorg-x11-fonts-Type1 xclock

# 如果上面还没配置后三行,或者配置了没有运行好,则在这里再次重启服务

sudo systemctl restart ssh

# 然后查看IP地址,这个需要后面复制到windows中

ip addr show

windows安装ssh命令如下:

  • 用管理员运行powershell,并执行以下命令:
cs 复制代码
# 以管理员身份运行PowerShell
Add-WindowsCapability -Online -Name OpenSSH.Client~~~~0.0.1.0

# 在PowerShell或CMD中测试连接 如果有其他服务器可用可以测试
ssh username@服务器IP地址

# 可以使用-p指定端口号
ssh -p 22 username@服务器IP地址

2、安装完了之后安装VSCode(以VSCode为例)其他的也类似,并进行配置

  • VSCode的安装过于简单,这里不再赘述,安装完成之后点击扩展图片安装Remote-ssh扩展。
  • 具体包括以下扩展,后面跟着的是扩展id,可以复制到vscode中直接安装扩展:
cs 复制代码
# 必须安装,没有remote-ssh无法使用VSCode链接远程服务器的基本功能
remote-ssh : ms-vscode-remote.remote-ssh

# 编辑ssh配置文件的,必须安装,不然每次都得手动输入很麻烦
remote-ssh-editing configuration files : ms-vscode-remote.remote-ssh-edit

# 查看远程服务器的,可以更加快捷的链接远程服务器
remote-explorer : ms-vscode.remote-explorer

# 安装,让VSCode可以编辑远程服务器的文件
remote-development : ms-vscode-remote.vscode-remote-extensionpack
  • 安装完成之后,点击左侧的小电脑,然后点击上面的远程(隧道/SSH),再点击设置按钮,配置ssh_config文件
  • 如果你有就点击有的,没有点击设置
  • 配置你想要的路径即可,然后打开该文件,在哪里打开都行,并且按照下面的格式填入配置
cs 复制代码
Host 随便取英文就行
  HostName 服务器ip地址,刚刚查看的那个
  User username
  Port 22    端口号,默认是22
  ForwardX11 yes        这俩打开,X11要用到
  ForwardX11Trusted yes

比如:
Host name
  HostName 222.222.22.22
  User name
  Port 22
  ForwardX11 yes
  ForwardX11Trusted yes
  • 然后点击刷新,你的ssh列表里面就会出现你刚才配置好的远程服务器,点击两个中的任意一个都可以链接服务器,第一次会让你选系统类型,就是你服务器的系统类型,然后输入用户名和密码,你在服务器上面的用户名和密码。就是你打开服务器终端时候显示的@前面的用户名即可,密码就是你设置的密码,一般是root密码。

  • 这样就通过VSCode连接上密码了,接下来是使用X11链接服务器,开启远程可视化。

3、久等了各位!MobaXterm,各位高级看官可直接跳至这里观看

  • 首先下载安装MobaXterm,很简单,去官网MobaXterm Xserver with SSH, telnet, RDP, VNC and X11 - Download下载用户免费版就行,就是左边那个,然后无脑安装,安装在哪个盘都行。
  • 打开MobaXterm,点击Sessin按钮,选择SSH,填写你刚刚ssh_config配置的信息,然后点击OK保存,具体如下:
  • 其他的内容默认即可,然后点击你配置好的ssh链接,就能打开X11终端,然后输入密码就可以链接远程服务器了,注意右上角X标志要变成下图所示:
  • 首先在这个X11终端里面测试一下是否真的可以使用图形化界面了,在命令行里面输入xclock如果跳出一个时钟gui代表成功,接下来就可以继续。

4、接下来使用VSCode同样连接上远程服务器!

相信熟悉的人已经知道怎么做了,就是用MobaXterm建立起可视化链接,然后使用VSCode进行代码编辑,这里只有一个点需要注意,就是输出的显示端口要一致。

在X11终端里面输入

cs 复制代码
echo $DISPLAY

查看X11输出的显示端口是什么,然后在VSCode中进行同样的配置,输入

cs 复制代码
export DISPLAY=localhost:10:0

#可能是这个,也可能不是,具体看X11终端输出

这样就可以直接使用VSCode链接的服务器VSCode终端进行可视化了,可以在VSCode终端输入xclock看看是否会出现一个时钟gui,如果出现代表成功!

5、这样就配置完了!

配置完毕之后就可以直接使用VSCode进行编程了哟,既可以使用远程服务器的超强算力,也可以使用本地的可视化,这样再也不用每次都挪代码了,方便快捷,十分优雅!

6、结语

  • 有可能会存在一些问题:
  • 最常见的是ssh链接不上,如果是这种情况我推荐ZeroTier,它允许你在服务器和自己电脑之间建立一个远程局域网,这样就可以通过ssh连接上,而不用使用VPN(没错之前没连接上很可能是因为不在同一个网络之下)

7、附加ZeroTier安装教程

  • 首先访问ZeroTier官网注册一个账号:ZeroTier Central
  • 左侧个人账号即可,注册完成之后会自动生成一个网络ID
  • 将其复制下来,取到远程服务器的终端,如果链接不上远程服务器,那么需要等到你能连上的时候去配置

远程服务器Linux终端运行以下命令:

cs 复制代码
# 安装zerotier
curl -s https://install.zerotier.com | sudo bash

# 如果你没有curl那么执行,然后再安装
sudo apt update && sudo apt upgrade -y
sudo apt install curl -y 

# 查看是否安装成功
sudo zerotier-cli info

# 启动服务
sudo systemctl start zerotier-one

# 设置开机自启
sudo systemctl enable zerotier-one

# 将远程服务器加入你的网络------------会显示200 join OK
sudo zerotier-cli join 你的NetworkID

本地Windows终端运行以下命令:

  • 首先下载安装https://download.zerotier.com/dist/ZeroTier%20One.msi ZeroTier客户端
  • 自动安装的,全部接受即可,安装在C盘也几乎不占用什么空间
  • 安装完成右下角任务栏会出现按黄色的ZeroTier图标,如果未出现则去任务栏搜索ZeroTier打开即可
  • 点击任务栏图标,点击Join New Network...
  • 完事回到ZeroTier的官网,你的网络会显示需要授权,点击accept就行,这里我点了正在转圈:
  • ++还有个重要设置需要注意!++
  • 就是记得查看你需要连接的设备的ZeroTier IPv4
  • 然后将你windows里面的ssh_config中的HostName改成这个虚拟ip才行。

然后在linux执行以下代码:

cs 复制代码
# 检查ZeroTier服务状态
sudo systemctl status zerotier-one

# 查看网络连接状态
sudo zerotier-cli status

# 列出加入的网络
sudo zerotier-cli listnetworks

# 会输出200 listnetworks <network id> <name> <status> <type> <mac> <bridge> <dev> <ips>
# 其中最后的ips就是你需要链接的虚拟ip,斜杠后面的不用管

# 重启ZeroTier服务,保证不会因为某些东西不能连接
sudo systemctl restart zerotier-one

# 顺便重启ssh
sudo systemctl start ssh

# Linux处理完毕 

在windows打开powershell执行以下命令:

cs 复制代码
# 先ping测试
ping <ips>

# 测试SSH端口
Test-NetConnection <ips> -Port 22

# 尝试SSH连接
ssh 用户名@<ips>

# 都成功了则代表可以连接了!

完事齐活,测试去,然后就打开VSCode重连这个服务器,并且按照上面的操作要求继续测试X11和xclock即可!

相关推荐
神の愛3 小时前
VSCode报错了??
ide·vscode·编辑器
BackCatK Chen4 小时前
Python安装与VSCode配置完整教程(每步带截图说明)
vscode·python·python安装·vscode配置·python 3.9.10·嵌入式环境配置
请为小H留灯5 小时前
一键解决 IDEA 中 Java 项目变橙色的问题!!!
java·ide·maven·intellij-idea·java项目
huabiangaozhi6 小时前
vscode配置django环境并创建django项目(全图文操作)
vscode·django·sqlite
KvPiter6 小时前
AI辅助开发行业动态(202603)
人工智能·编辑器
2501_916008899 小时前
iOS开发者工具有哪些?Xcode、Fastlane 与 kxapp 的组合使用
ide·vscode·macos·ios·个人开发·xcode·敏捷流程
无巧不成书02189 小时前
编辑器、编译器与解释器全解析
编辑器·编译原理·编译器·编程入门·解释器·开发工具链
Irene19919 小时前
Cursor 访问在 WSL 中的项目:使用不同的编辑器修改WSL中的同一个项目,会自动同步
编辑器
承渊政道10 小时前
【优选算法】(实战剖析链表核心操作技巧)
开发语言·数据结构·c++·vscode·学习·算法·链表