如何在Docker容器中运行VSCode并通过浏览器访问其UI界面

嘿，你说的这个需求完全可以实现，而且比Home Assistant那种受限的方式更通用——其实有个专门的工具就是干这个的，叫code-server，它本质上是把VSCode打包成了可以通过浏览器访问的Docker镜像，部署后就能在任何能访问你本地服务器的浏览器里使用统一的开发环境，完美解决你不想在多台机器重复配置的痛点。

下面是具体的实现步骤：

一、拉取官方code-server镜像 #

首先拉取Coder官方维护的code-server镜像，这是最稳定可靠的版本：

docker pull codercom/code-server

二、启动Docker容器 #

直接用docker run命令就能快速启动，这里给你一个包含常用配置的命令：

docker run -d \
  -p 8080:8080 \
  -v "$HOME/.config/code-server:/home/coder/.config" \
  -v "$HOME/your-projects:/home/coder/project" \
  -u "$(id -u):$(id -g)" \
  -e PASSWORD=your-strong-password-here \
  codercom/code-server

我给你解释下每个参数的作用：

• -d：让容器在后台运行，不占用当前终端
• -p 8080:8080：把容器的8080端口映射到服务器的8080端口，你也可以改成其他端口，比如9000:8080
• -v "$HOME/.config/code-server:/home/coder/.config"：挂载本地的配置目录，这样容器重启后VSCode的插件、设置都不会丢失
• -v "$HOME/your-projects:/home/coder/project"：挂载你的项目目录，让容器能访问本地服务器上的代码文件，记得把your-projects改成你实际的项目路径
• -u "$(id -u):$(id -g)"：用当前用户的UID和GID运行容器，避免后续操作文件时出现权限问题
• -e PASSWORD=your-strong-password-here：设置浏览器访问时的登录密码，建议设置一个强密码

三、通过浏览器访问VSCode UI #

启动容器后，打开浏览器输入：

http://你的服务器IP:8080

输入你刚才设置的密码，就能看到和本地VSCode几乎一模一样的界面了！所有插件、配置都会保存在你挂载的配置目录里，下次启动容器直接沿用。

进阶：用Docker Compose管理容器 #

如果想更方便地管理容器（比如修改配置、重启服务），可以用Docker Compose来部署，创建一个docker-compose.yml文件：

version: "3.8"
services:
  code-server:
    image: codercom/code-server
    ports:
      - "8080:8080"
    volumes:
      # 挂载配置目录，保存VSCode设置和插件
      - ./config:/home/coder/.config
      # 挂载项目目录，替换成你自己的路径
      - ./projects:/home/coder/project
    # 使用当前用户权限运行，避免权限问题
    user: "${UID}:${GID}"
    environment:
      # 设置登录密码
      - PASSWORD=your-secure-password
    # 容器启动时自动重启
    restart: unless-stopped

然后在当前目录执行下面的命令启动容器：

# 先导出当前用户的UID和GID（Linux/macOS）
export UID=$(id -u) GID=$(id -g)
# 启动容器
docker-compose up -d

这样容器会自动在服务器开机时启动，管理起来更省心。

补充说明 #

• 如果你不想设置固定密码，也可以用-e HASHED_PASSWORD环境变量，传入密码的哈希值，更安全。哈希值可以用code-server hash-password命令生成（可以先临时启动一个容器执行这个命令）。
• 插件安装和本地VSCode完全一样，直接在扩展市场搜索安装就行，所有插件都会存在挂载的配置目录里，不会因为容器重启丢失。

备注：内容来源于stack exchange，提问作者sDoky