code-server 是一个基于 Visual Studio Code(VSCode)的开源项目,它允许用户通过 Web 浏览器来使用 VSCode 的编辑功能。这意味着,只要有浏览器和网络连接,用户就可以在任何设备上访问和使用 VSCode,而无需在本地安装开发环境。

code-server项目的官方Github项目网址: https://github.com/coder/code-server

code-server有着一次部署后开箱即用的绿色安装的特点,通过将其部署在某个服务器上,后再浏览器中输入服务器的IP和code-server的端口就可以访问到该服务了。code-server的使用与vscode没有什么区别,甚至有一些vscode所没有的功能,具体可以看其官方文档 https://coder.com/docs/code-server/guide 。

code-server可以直接拉代码进行安装,也可以拉取官方封装包的镜像进行安装,还可以直接使用期在线的安装脚本进行安装。

code-server需要的硬件配置,在其项目的readme页面中有指出,需要2核1GRAM。

首先来看看直接拉取 Docker 镜像的安装方式:

这种方式是最简单的安装方式。

第一步、使用 docker pull codercom/code-server 命令拉取 code-server 的 Docker 镜像。

第二步、使用 docker run -d -p 8080:8080 --restart=alway --name code -e PASSWORD=123456 codercom/code-server 命令启动容器,并设置相应的环境变量和端口映射。

本文使用Docker安装部署,操作步骤:安装Docker、拉取镜像、安装部署。

一、拉取仓库中的镜像

demouser@demohosts:~$ docker pull codercom/code-server
Using default tag: latest
latest: Pulling from codercom/code-server
8cd46d290033: Pull complete 
eeb9b07c101b: Pull complete 
6f162b027a5c: Pull complete 
0b474284911d: Pull complete 
d21988f363a5: Pull complete 
e2edc2d67ab6: Pull complete 
27d75a434669: Pull complete 
4f4fb700ef54: Pull complete 
Digest: sha256:c69e398d1b64589b3b77a7becfd03f4ec524982def20e6bffbb51b1b839e72ba
Status: Downloaded newer image for codercom/code-server:latest
docker.io/codercom/code-server:latest

二、利用镜像启动容器

demouser@demohosts:~$ docker run -d -p 8080:8080 -e PASSWORD=123456 codercom/code-server
09781340a18500ff8502b5f0493e24aa3e8052581cb3dbc7b84ffc713ce6b40e

启动容器时的PASSWORD参数,是配置了在web中访问code-server时的密码,算是一种安全机制,需要输入密码登录后才能使用code-server。

在浏览器中输入http://服务器IP:8080,即可访问到code-server

搭建网页版VScode 输入正确的密码后,就可以进入到编辑器的界面

搭建网页版VScode 安装插件的方法与vscode的安装方式一样,下图就是给code-server安装了简体中文插件。

搭建网页版VScode

使用docker-compose的方式拉取镜像并运行

安装docker-compose

首先是docker-compose的安装,命令中直接指定了将该文件下载到/usr/local/bin下面,下载完成后再为其添加执行的权限,这样docker-composer就按照完成了。

demouser@demohosts:~$ sudo  curl -SL https://github.com/docker/compose/releases/download/v2.29.6/docker-compose-linux-x86_64 -o /usr/local/bin/docker-compose
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:--  0:00:19 --:--:--     0
100 60.8M  100 60.8M    0     0  40985      0  0:25:56  0:25:56 --:--:-- 45843
demouser@demohosts:~$ sudo chmod +x /usr/local/bin/docker-compose

查看其版本信息来确定是否可以正常的执行

demouser@demohosts:~$ docker-compose version
Docker Compose version v2.29.6

创建docker-compose.yml文件

创建docker-compose.yml文件,文件的内容如下:

version: "3.9"

services: 
  code-server: 
    image: codercom/code-server
    restart: always
    ports: 
      - "8080:8080"
    volumes: 
      - /data/code/:/home/coder/
    environment: 
      PASSWORD: 123456

镜像内创建了名为coder的用户,且镜像中已经指定了使用coder用户启动code-server,code-server默认是打开用户的家目录作为工作目录,这里挂载映射时要映射的容器内路径应该为/home/coder。

使用docker-compose启动容器

启动容器前先创建目,用于挂载容器内的工作目录到本地

sudo mkdir -p /data/code
sudo chmod -R 777 /data/code

编排的规约文件创建完成后,就可以利用该规约文件来启动容器。

demouser@demohosts:~$ docker-compose up -d
WARN[0000] /home/demouser/docker-compose.yml: the attribute `version` is obsolete, it will be ignored, please remove it to avoid potential confusion 
[+] Running 9/9
 ✔ code-server Pulled                                                                                                121.5s 
   ✔ 8cd46d290033 Pull complete                                                                                       51.9s 
   ✔ eeb9b07c101b Pull complete                                                                                       83.3s 
   ✔ 6f162b027a5c Pull complete                                                                                       83.4s 
   ✔ 0b474284911d Pull complete                                                                                       83.4s 
   ✔ d21988f363a5 Pull complete                                                                                       83.5s 
   ✔ e2edc2d67ab6 Pull complete                                                                                       83.5s 
   ✔ 27d75a434669 Pull complete                                                                                      117.7s 
   ✔ 4f4fb700ef54 Pull complete                                                                                      117.7s 
[+] Running 2/2
 ✔ Network demouser_default          Created                                                                           0.1s 
 ✔ Container demouser-code-server-1  Started                                                                           1.6s 

查看容器的运行状态:

demouser@demohosts:~$ docker-compose ps -a
WARN[0000] /home/demouser/docker-compose.yml: the attribute `version` is obsolete, it will be ignored, please remove it to avoid potential confusion 
NAME                     IMAGE                  COMMAND                   SERVICE       CREATED         STATUS         PORTS
demouser-code-server-1   codercom/code-server   "/usr/bin/entrypoint…"   code-server   6 minutes ago   Up 6 minutes   0.0.0.0:8080->8080/tcp, :::8080->8080/tcp

容器已经正常启动并运行了,和上面一样的方法在浏览器中输入访问的地址进行访问。

搭建网页版VScode