在浏览器中使用 VSCode 连接开发服务器

有时候总会遇到这么个尴尬事情,出门的时候突然想起来自己网站上有个 bug 没修,这时候手边又通常不会带着开发电脑,不修 bug 又浑身难受,这可怎么搞呢?

不如来试试 Code Server,一个可以通过 Docker 部署在服务器上的在线 VSCode。

1 创建工作区

首先,我们需要在服务器上创建一个工作区目录,方便挂在到后续的 Docker 容器中:

mkdir -p $HOME/workspace
cat >> $HOME/.zshrc <<'EOF'
export WORKSPACE="$HOME/workspace"

EOF

注意,这里的 cat 命令使用了追加,千万不要将 >> 写成 > 从而使配置文件被覆盖。

2 创建 Code Server 配置

推荐使用 https 提供服务,以保证数据安全。不过鉴于通常大家都有 nginx 作为代理,所以这里只展示 http 方式部署 Code Server。

mkdir -p $HOME/.config/code-server

cat > $HOME/.config/code-server/config.yaml <<EOF
bind-addr: 0.0.0.0:80
auth: password
password: ChangeYourPassword
cert: false
user-data-dir: $HOME/.config/code-server/data
extensions-dir: $HOME/.config/code-server/extensions

EOF

别忘了修改你的 password 字段来变更密码。

3 运行 Code Server 容器

我们将刚刚配置好的工作区和配置文件挂载到容器内,并将 Code Server 的端口映射到本机的网络:

docker run -d --name code-server \
  --net host \
  -v "$HOME/.config/code-server:$HOME/.config/code-server" \
  -v "$WORKSPACE:$HOME/workspace" \
  --privileged \
  -v "/var/run/docker.sock:/var/run/docker.sock" \
  -v "/bin/docker:/bin/docker" \
  -v "$HOME/.ssh:$HOME/.ssh" \
  iinfinity/coder:latest

在浏览器中输入你的服务器 ip 即可开始使用你的 Online VSCode。


附录:一键运行脚本

可以通过该 GitHub Gist 获取脚本并执行:

wget -O - https://775.ink/2hx3pgaawk5c | zsh
从 GitHub Gist 获取并运行脚本
IInfinity

IInfinity

大道虽简,知易行难。
CN