有了这个 4.5 万 Star 的工具,可在浏览器中运行最强编辑器 VS Code!

【导语】:一个让你能在浏览器中运行 VS Code 的工具。

简介

code-server 是一个基于 VS Code 的在线编辑器,在任何地方的任何机器上运行 VS Code 并在浏览器中访问它,实现任何设备通过浏览器即可访问 VS Code,进而实现远程在线开发。

它的亮点是:

  • 为用户提供了一致的代码开发环境;
  • 基于服务器加速测试、编译、下载;
  • 延长个人电脑的电池寿命,将密集型任务转移到服务器上运行;

官方建议服务器至少要有 1 GB 内存和 2 核。

项目地址是:

https://github.com/cdr/code-server

下载安装

脚本安装

官方提供了一个脚本来为 Linux、macOS 和 FreeBSD 安装 code-server。

  • 首先尝试打印安装过程中的详细内容,这个过程不会进行安装:
curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run
  • 真正安装:
curl -fsSL https://code-server.dev/install.sh | sh

独立安装

官方提供了独立的压缩安装文件,下载对应服务器的版本,解压缩即可使用。

// 完成后访问 http://127.0.0.1:8080,密码保存在 ~/.config/code-server/config.yaml 配置文件中
mkdir -p ~/.local/lib ~/.local/bin
curl -fL https://github.com/cdr/code-server/releases/download/v$VERSION/code-server-$VERSION-linux-amd64.tar.gz \
  | tar -C ~/.local/lib -xz
mv ~/.local/lib/code-server-$VERSION-linux-amd64 ~/.local/lib/code-server-$VERSION
ln -s ~/.local/lib/code-server-$VERSION/bin/code-server ~/.local/bin/code-server
PATH="~/.local/bin:$PATH"
code-server
# Your password is in 

Docker 安装

# 这将启动一个 code-server 容器并通过 http://127.0.0.1:8080 访问
mkdir -p ~/.config
docker run -it --name code-server -p 127.0.0.1:8080:8080 \
  -v "$HOME/.config:/home/coder/.config" \
  -v "$PWD:/home/coder/project" \
  -u "$(id -u):$(id -g)" \
  -e "DOCKER_USER=$USER" \
  codercom/code-server:latest

访问配置

官方强烈建议不要在公网暴露不需要认证或加密的 code-server,在默认情况下,code-server 会使用密码验证,密码从配置文件(~/.config/code-server/config.yaml)中获取。它只监听 localhost 的请求以避免将自己暴露出去。如果想从不同的地方安全地使用 code-server,则可以采用以下方法。

SSH 转发

官方推荐这种方法,因为不需要任何额外的设置,只需要在远程机器上有一个 SSH 服务。缺点是无法在没有 SSH 客户端的设备上访问,如 iPad。

  • 首先,通过 ssh 进入实例并编辑 code-server 配置文件以禁用密码身份验证:
# 将 “auth: password” 替换为 “auth: none”
sed -i.bak 's/auth: password/auth: none/' ~/.config/code-server/config.yaml
  • 重启:
sudo systemctl restart code-server@$USER
  • 本地计算机运行以下命令,将本地端口 8080 转发到远程实例:
# -N disables executing a remote shell
ssh -N -L 8080:127.0.0.1:8080 [user]@<instance-ip>

现在就可以在本地计算机通过 http://127.0.0.1:8080 访问 code-server

使用 Let's Encrypt

  1. 首先需要购买一个域名,推荐 Google Domains
  2. 将 code-server 实例IP与域名绑定
  3. 安装 nginx:
sudo apt update
sudo apt install -y nginx certbot python3-certbot-nginx
  1. 将以下内容放到 /etc/nginx/sites-available/code-server 文件中:
server {
    listen 80;
    listen [::]:80;
    server_name mydomain.com;

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

mydomain.com 是你使用的域名。

  1. 启用配置
sudo ln -s ../sites-available/code-server /etc/nginx/sites-enabled/code-server
sudo certbot --non-interactive --redirect --agree-tos --nginx -d mydomain.com -m me@example.com

其中 me@example.com 使用你自己实际的电子邮件。访问 https://your-domain-name 即可访问 code-server。

\6. 以上 3 到 5 可使用 Caddy 替代,详细说明参考官网。

使用自签名证书

建议将次作为最后的手段,因为自签名证书不适用与 iPad,并可能导致其他奇怪的问题。

首先 ssh 进入 code-server 服务器并编辑配置文件以使用随机生成的自签名证书:

# Replaces "cert: false" with "cert: true" in the code-server config.
sed -i.bak 's/cert: false/cert: true/' ~/.config/code-server/config.yaml
# Replaces "bind-addr: 127.0.0.1:8080" with "bind-addr: 0.0.0.0:443" in the code-server config.
sed -i.bak 's/bind-addr: 127.0.0.1:8080/bind-addr: 0.0.0.0:443/' ~/.config/code-server/config.yaml
# Allows code-server to listen on port 443.
sudo setcap cap_net_bind_service=+ep /usr/lib/code-server/lib/node

重启:

sudo systemctl restart code-server@$USER

FAQ

使用 code-server 时会遇到一些问题。比如与 VS Code 的差异?如何禁用遥测?如何调试代码服务器?这些问题都可以在官方 FAQ 文档中找到:

https://github.com/cdr/code-server/blob/main/docs/FAQ.md#how-should-i-expose-code-server-to-the-internet

开源前哨 日常分享热门、有趣和实用的开源项目。参与维护 10万+ Star 的开源技术资源库,包括:Python、Java、C/C++、Go、JS、CSS、Node.js、PHP、.NET 等。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,457评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,837评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,696评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,183评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,057评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,105评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,520评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,211评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,482评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,574评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,353评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,213评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,576评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,897评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,174评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,489评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,683评论 2 335

推荐阅读更多精彩内容