code-server是一款在线的vscode工具,只要将 code-server 部署到自己的服务器之后,就可以通过浏览器使用vscode,很好的解决了远程编辑服务器中文件的问题,方便好用。
code-server的地址为: https://github.com/cdr/code-server

1、docker安装

(1)、准备

  • 准备一台linux机器
  • 安装docker:https://docs.docker.com/install/linux/docker-ce/centos/
  • 如果要反向代理,安装nginx

(2)、安装

  • 在linux上创建一个目录,用来存放编辑器可以访问的文件例如:

    mkdir -p /usr/local/codefolder
    
  • 修改文件夹的权限,否则无法创建和修改文件

    chmod -R 777 /usr/local/codefolder
    
  • 安装:

    docker run --name codeserver -d -p 127.0.0.1:8443:8443 -v "/usr/local/codefolder:/home/coder/project" codercom/code-server --allow-http --no-auth
    
  • 浏览器访问http://localhost:8443

(3)、参数配置详情

sage: code-server [options]

Run VS Code on a remote server.

Options:
  -V, --version                         output the version number
  --cert <value>
  --cert-key <value>
  -e, --extensions-dir <dir>            Override the main default path for user extensions.
  --extra-extensions-dir [dir]          Path to an extra user extension directory (repeatable). (default: [])
  --extra-builtin-extensions-dir [dir]  Path to an extra built-in extension directory (repeatable). (default: [])
  -d, --user-data-dir <dir>             Specifies the directory that user data is kept in, useful when running as root.
  -h, --host <value>                    Customize the hostname. (default: "0.0.0.0")
  -o, --open                            Open in the browser on startup.
  -p, --port <number>                   Port to bind on. (default: 8443)
  -N, --no-auth                         Start without requiring authentication.
  -H, --allow-http                      Allow http connections.
  --disable-telemetry                   Disables ALL telemetry.
  --socket <value>                      Listen on a UNIX socket. Host and port will be ignored when set.
  --trust-proxy                         Trust the X-Forwarded-For header, useful when using a reverse proxy.
  --install-extension <value>           Install an extension by its ID.
  -h, --help                            output usage information

(4)、插件安装

code-server目前还不支持在线安装插件,不过它提供了.VSIX方式的安装,下面以python插件为例演示插件的安装。

  • 下载python插件:https://github.com/Microsoft/vscode-python/releases。可以通过命令下载:

    wget https://github.com/Microsoft/vscode-python/releases/download/2019.3.6558/ms-python-release.vsix
    
  • 查看docker容器中是否有Python环境,没有则安装Python。

    #进入dockers容器
    docker exec -it codeserver /bin/bash
    #查看Python环境
    sudo python -V
    sudo python3 -V
    #安装python,根据主机选择相应命令
    sudo apt-get update
    sudo apt-get install python3
    #再次查看Python环境
    sudo python3 -V
    #退出Python及docker容器(注意一定要退出容器)
    exit()
    exit()
    #切换到刚才下载的Python插件目录,将文件复制到docker容器
    sudo docker cp ms-python-release.vsix codeserver:/usr/local
    
  • 利用VSIX安装
    在这里插入图片描述

  • 测试代码

    #!/usr/bin/python3
     
    # 计算面积函数
    def area(width, height):
        return width * height
     
    def print_welcome(name):
        print("Welcome", name)
     
    print_welcome("Runoob")
    w = 4
    h = 5
    print("width =", w, " height =", h, " area =", area(w, h))
    

    测试结果:
    在这里插入图片描述

2、二进制文件

(1)、准备

  • 准备一台Linux
  • 下载二进制文件,下载地址:https://github.com/cdr/code-server/releases
  • 如果要反向代理,安装nginx

(2)、安装

  • 解压缩下载的文件
  • 然后运行二进制文件./code-server。默认情况下,code-server使用随机生成的密码启用密码身份验证。您可以将PASSWORD环境变量设置为使用您自己的环境变量,或用于--auth none禁用密码身份验证。
  • 如需后台启动请运行nohup ./code-server --auth none > /dev/null 2>&1 &,如需指定端口--port 8443
  • 在浏览器访问localhost:8080

(3)、参数配置详情

./code-server --help

(4)、插件安装

code-server目前还不支持在线安装插件,不过它提供了.VSIX方式的安装,下面以python插件为例演示插件的安装。

  • 下载python插件:https://github.com/Microsoft/vscode-python/releases。可以通过命令下载:

    wget https://github.com/Microsoft/vscode-python/releases/download/2019.3.6558/ms-python-release.vsix
    
  • 利用VSIX安装
    在这里插入图片描述

  • 测试代码

    #!/usr/bin/python3
     
    # 计算面积函数
    def area(width, height):
        return width * height
     
    def print_welcome(name):
        print("Welcome", name)
     
    print_welcome("Runoob")
    w = 4
    h = 5
    print("width =", w, " height =", h, " area =", area(w, h))
    

    测试结果:
    在这里插入图片描述

3、Nginx反向代理

配置文件:

#user  nobody;
worker_processes  2;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    client_max_body_size  200m;

    #gzip  on;
    
    map $http_upgrade $connection_upgrade {  
        default upgrade;  
        '' close;  
    }
    
    upstream websocket {
        server localhost:8443;  
    }
 
	server {
        listen       80;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {  
            proxy_pass http://websocket;  
            proxy_http_version 1.1;  
            proxy_set_header Upgrade $http_upgrade;  
            proxy_set_header Connection "Upgrade";  
        }
    }
}

Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐