Visual Studio Code Cloud IDE 是微软广受欢迎的 Visual Studio Code（VS Code）编辑器的在线版本，旨在提供灵活且易于访问的云端开发环境。它允许开发者直接从 Web 浏览器编写代码，无需在本地机器上安装任何软件。这种基于云的 IDE 与 GitHub 及其他云服务无缝集成，支持实时协作、跨设备轻松访问项目以及在分布式环境中工作。凭借语法高亮、调试和扩展等功能，Visual Studio Code Cloud IDE 提供完整的开发体验，是需要强大、可移植编码环境的开发者的便捷解决方案，几乎可以从任何地方访问。

本指南将介绍如何在 Ubuntu 24.04 服务器上安装 Visual Code-Server，并将 Nginx 配置为反向代理。

前提条件

在开始之前，请确保您具备以下条件：

• 一台 Ubuntu 24.04 服务器。
• 一个具有管理员权限的非 root 用户。
• 一个指向服务器 IP 地址的域名。

使用安装脚本安装 code-server

要安装 code-server，可以下载并运行 code-server 安装脚本。在本示例中，您将以非 root 用户身份安装 code-server。因此，请确保您已登录到您的用户。

首先，运行以下命令以确保 code-server 可以安装在您的系统上：

curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run

当 code-server 安装在您的系统上时，您将看到以下输出：

现在使用以下命令安装 code-server。在询问时输入您的 sudo/管理员密码。

curl -fsSL https://code-server.dev/install.sh | sh

安装完成后，使用以下 systemctl 命令启动并启用 code-server。

sudo systemctl enable --now code-server@$USER

最后，使用以下命令检查 code-server 服务，以确保该服务正在运行。

sudo systemctl status code-server@$USER

在此输出中，您可以看到 code-server 正在运行，它在默认端口 8080 上运行。

配置 code-server 密码

安装 code-server 后，您将设置密码身份验证来保护 code-server 环境。

使用 nano 编辑器打开默认的 code-server 配置文件 ~/.config/code-server/config.yaml。

nano ~/.config/code-server/config.yaml

使用您的安全密码更改默认密码。

bind-addr: 127.0.0.1:8080
auth: password
password: 0e0cb3af923c659366334664
cert: false

保存文件并退出编辑器。

现在运行以下命令重启 code-server 并应用您的更改。

sudo systemctl restart code-server@$USER

将 Nginx 设置为反向代理

现在您已经保护了 code-server，接下来将安装 Nginx 并将其配置为反向代理。因此，请确保您已将域名指向服务器 IP 地址。

使用以下 apt 命令安装 Nginx Web 服务器。输入 Y 确认安装。

sudo apt install nginx -y

安装完成后，使用 nano 编辑器创建一个新的服务器块配置文件 /etc/nginx/sites-available/code-server.conf。

sudo nano /etc/nginx/sites-available/code-server.conf

将以下配置插入到文件中，并确保将域名更改为 code.howtoforge.local。

server {
listen 80;
listen [::]:80;
server_name code.howtoforge.local;

location / {
proxy_pass http://localhost:8080/;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection upgrade;
proxy_set_header Accept-Encoding gzip;
}
}

完成后，保存文件并退出编辑器。

接下来，运行以下命令激活 code-server.conf 服务器块并验证您的 Nginx 配置。

sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/
sudo nginx -t

如果配置正确，您将看到输出 syntax is ok - test is successful。

现在运行以下命令重启 Nginx Web 服务器并应用更改。然后，检查 Nginx 状态以确保 Web 服务器正在运行。

sudo systemctl restart nginx
sudo systemctl status nginx

在以下输出中，您可以看到 Nginx Web 服务器作为 code-server 应用程序的反向代理正在运行。

设置 UFW（简单防火墙）

要允许访问 code-server，您必须通过 UFW（简单防火墙）打开 HTTP 和 HTTPS 端口。

运行以下命令以启用 Nginx Full 配置文件，并允许 HTTP 和 HTTPS 流量访问您的 Nginx 安装。添加后，您将看到输出 Rule added。

sudo ufw allow 'Nginx Full'

现在运行以下命令检查 UFW 状态。确保已启用 Nginx Full 配置文件以允许来自任何地方的访问。

sudo ufw status

使用 HTTPS 保护 code-server

在本节中，您将通过 certbot 和 letsencrypt 生成 SSL/TLS 证书来使用 HTTPS 保护 code-server。

使用以下 apt 命令安装 certbot 和 python3-certbot-nginx 软件包。

sudo apt install certbot python3-certbot-nginx

安装完成后，执行以下 certbot 命令以生成 SSL/TLS 证书并保护您的 code-server 安装。请确保将域名和电子邮件地址更改为您的信息。

sudo certbot --nginx --agree-tos --redirect --hsts --staple-ocsp --email alice@howtoforge.local -d code.howtoforge.local

过程完成后，您的 code-server 安装将自动受到 HTTPS 保护。您的 SSL/TLS 证书将在 /etc/letsencrypt/live/code.howtoforge.local 目录中可用。

访问 code-server

打开您的 Web 浏览器并访问 https://code.howtoforge.local。如果安装成功，系统将提示您进行密码身份验证。

输入您的密码并单击 SUBMIT 确认。

如果密码正确，您将看到以下 code-server 屏幕。选择您的默认主题，浅色或深色。

现在您将在 Web 浏览器中获得以下实时 code-server。

结论

恭喜！您已经完成了在 Ubuntu 24.04 服务器上安装 VS code server。您已安装并使用密码身份验证和 HTTPS 保护了 code 服务器，并将 Nginx 配置为 code 服务器安装的反向代理。