腾讯云服务器部署 code-server
腾讯云服务器部署 code-server
背景
在2021年12月份,经历了人生第一次『毕业』,面临着马上要回家过年,希望在回家前可以把新工作确定下来,于是乎进入比较繁忙的准备面试和找工作的阶段,博客也就很少更新了。所幸在回家过年前找到了工作。
确定工作之后,计划写点什么,但是有不知道怎么去表达这个东西,所以就没了下文。后来有一天发现博客的图片全都成了裂图。后来才知道码云(Gitee)上托管的图片都加了防盗链;想起博客部署在github-page上打开速度又比较慢,因此在这种背景下决定自己重新搞一下博客,于是有了以下准备:
- 购买云服务器(腾讯云)
- 购买域名
- 申请七牛云图片存储空间(免费)
在工作之余慢慢的把博客做了迁移,之前的博客虽然没有下掉,但是也不再更新了。
之所以会部署 code-server 主要是之前就知道这个在线的VScode编辑器,但是苦于没有服务器一直没有搞(记得第一次在B站了解到这个东西的时候还想着可以用ipad写代码)。因此在博客迁移结束之后,就想着搞一把,爽一把。哈哈哈~(此处是杠铃般的笑声)
天也不早了,咱言归正传,说一下部署过程及遇到的问题和相应的解法。
冲冲冲~
部署步骤
部署环境
Centos 7.x
下载 code-server
下载地址:code-server
或者命令行下载:
1 | wget https://github.com/coder/code-server/releases/download/v3.5.0/code-server-3.5.0-linux-x86_64.tar.gz |
解压安装
1 | tar -zxvf code-server-3.5.0-linux-x86_64.tar.gz -C /opt/ |
配置 code server
1 | cd code-server |
编辑配置文件
1 | bind-addr: 127.0.0.1:8080 |
启动 code-server
code-server 命令的路径是/opt/code-server/bin
, 为了启动方便,我们把这个路径加到环境变量中:
1 | vim ~/.bashrc |
在文件的最后一行添加:
1 | export PATH=/opt/code-server/bin:$PATH |
然后执行source ~/.bashrc
使配置生效。
然后在后台运行code-server:
1 | code-server --config /opt/code-server/config.yaml & |
这个时候其实code-server已经启动成功,下面需要在访问子域名xxx.up-4ever.site
的时候打开这个在线vscode。
配置 nginx && 配置DNS解析
按照上面的说法,我们需要在访问xxx.up-4ever.site
时候可以打开线上的vscode,为了实现这个效果,需要做两件事请:
- 在腾讯云控制台配置子域名解析到服务器
- nginx转发来之子域名的请求
- 首先添加一条记录:子域名解析到云服务器
- 配置nginx
1 | server { |
然后打开xxx.up-4ever.site
发现输入密码后,一直白屏,打开浏览器控制台发现报错如下:WSS,WebSocket close with status code 1006,Unable to read file。
分析发现每一个错误都跟websocket有关,而最有效的信息便是 1006 这个错误码。在websocket中,1006就是超时的意思,再进一步查阅资料发现是因为我们对地址进行了代理转发而引起的,原因是在代理时没有对websocket进行代理。解决办法:利用Upgrade协议头机制将连接从HTTP连接升级到WebSocket连接。
因此需要修改nginx配置如下
1 | server { |
然后重启nginx即可。
1 | nginx -t |
然后打开xxx.up-4ever.site
就可以正常打开在线Vscode咯~
code-server 配置参数
参数 | 说明 |
---|---|
auth | 自定义身份验证类型,如果不设置则默认只有password。[password, none] |
cert | https证书路径。如果没有提供路径,则自动生成。 |
cert-key | 非生成证书时证书密钥的路径,如果用自己的https证书认证的话此段必填。 |
disable-updates | 禁用更新,没什么好说的。 |
disable-telemetry | 禁用遥测。就是不允许向微软服务器发送错误或数据信息。 |
help | 帮助指令。 |
open | 启动时在浏览器中打开。不能远程工作。 |
bind-addr | 设置ip地址访问与端口号。[host:port ] |
socket | socket路径,设置bing-addr的话此指令可以忽略。 |
version | 查看当前版本。 |
user-data-dir | 用户文件路径。 |
extensions-dir | 扩展文件存储路径。 |
list-extensions | 列出vscode安装的所有扩展插件。 |
force | 阻止在安装VS代码扩时显示提示 。 |
install-extension | 通过id或者vsix安装指定vscode扩展插件。 |
uninstall-extension | 通过id卸载指定vscode扩展插件。 |
show-versions | 显示vscode扩展插件版本。 |
proxy-domain | 设置代理端口的域名。 |
verbose | 启用详细日志记录。 |