使用Google云服务器搭建在线vscode

最新推荐文章于 2023-10-10 11:41:39 发布

盼儿哥

最新推荐文章于 2023-10-10 11:41:39 发布

阅读量649

点赞数

分类专栏：前端文章标签： vscode visual studio code ide

原文链接：https://blog.hpanpan.cc/2021/10/28/%E4%BD%BF%E7%94%A8Google%E4%BA%91%E6%9C%8D%E5%8A%A1%E5%99%A8%E6%90%AD%E5%BB%BA%E5%9C%A8%E7%BA%BFvscode.html

版权

前端专栏收录该内容

36 篇文章 1 订阅

订阅专栏

严格来说不应该叫vscode,应该叫code-server

开源项目：https://github.com/linuxserver/docker-code-server

Docker镜像：https://hub.docker.com/r/linuxserver/code-server

自从会用Docker后，感觉太爽了~ 下面就是基于Docker部署code-server

实现功能：

通过 https://code-server.hpanpan.cc/ 打开，输入密码后登录，登录后就像用本地vscode一样啦，需要注意一点是扩展插件官方说无法连接到在线库，但我试了是可以的如下：

Docker 安装方法这里不讲，很多教程

下面是docker code-server 镜像启动代码：

docker run -d \
  --name=code-server \
  -e PUID=1000 \
  -e PGID=1000 \
  -e TZ=Asia/Shanghai \
  -e PASSWORD=123456 \
  -e SUDO_PASSWORD=123456  \
  -e PROXY_DOMAIN=code-server.hpanpan.cc   \
  -p 8000-9000:8000-9000 \
  -v /home/code-server/config:/config \
  --restart unless-stopped \
  lscr.io/linuxserver/code-server

其中的-p 8000-9000:8000-9000说一下，code-server 默认端口是8443，使用过程中可能需要自定义启动程序向外暴露接口，比如 npm run dev

程序中启动了8001端口，所以用docker批量端口映射来满足开发需要。启动后就可以用 http://34.92.198.141:8443 访问了

然后如何访问 https://code-server.hpanpan.cc 打开code-server 是属于域名解析方面的事情，下面是我的nginx配置：

server {
       listen       443 ssl;
       server_name  code-server.hpanpan.cc;
       proxy_set_header  Host  $host;
       proxy_set_header  X-real-ip $remote_addr;
       proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
       add_header 'Access-Control-Allow-Credentials' 'true';
       ssl_certificate_key  xxx.key;
       ssl_certificate  xxx.pem;
       location / {
             proxy_pass http://code-server.hpanpan.cc:8443; #这里不要用http://localhost:8443,访问时会报错的
             proxy_set_header Upgrade $http_upgrade;
             proxy_set_header Connection upgrade;
             proxy_set_header Accept-Encoding gzip;
       }
}
server {
   listen 80;
   server_name code-server.hpanpan.cc;
   rewrite ^(.*)$ https://code-server.hpanpan.cc;
}

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-q2lbtiXR-1636510711754)(https://user-images.githubusercontent.com/15027167/139246438-99ab0909-9229-4d05-baf9-9e3006ed40a4.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LSLgc4E4-1636510711757)(https://user-images.githubusercontent.com/15027167/139241466-289c4fba-0878-4033-af8c-60905343628d.png)]