百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 博客教程 > 正文

安装Code-server并配置用于多用户的反向代理(Nginx)

connygpt 2024-11-21 13:22 15 浏览

1.安装code-server

code-server的项目网址在cdr/code-server.

在code-server的README中, 提供了两份部署指南, 一份是用于部署在AWS等云服务的deploy, 另一份则是我们要用的用于部署在本地的quickstart.

Guide非常简洁明了, 就三步:

  1. 在releases page上找到对应架构和系统的二进制包并下载.
  2. 解包然后运行二进制文件(./code-server).
  3. 在浏览器中通过localhost:8080来访问.

对于确实是在本地用的人而言, 这就足够了, 但是考虑到要长期运行在服务器端并且需要远程访问, 需要做一些手脚:

  1. 服务器端要架不止一个code-server, 所以端口不能全用默认的8080.
  2. 用http远程访问存在巨大隐患, 但是code-server自带的SSL加密在某次更新后失效了, 所以要用反向代理.

先不说反代, 来把code-server的部分弄好.

要更改端口, 只需要在启动时加上参数, 比如--port 23333.

它每次启动时默认会生成一个随机密码, 显示在终端中.

也可以自定义别的密码或者干脆不要, 不要的话直接加上参数--auth none, 要密码的话则需要在环境中定义变量PASSWORD, 并且是明文, 所以这个变量要做成尽可能局部的变量, 不仅是为了安全考虑, 而且不能不同的code-server用同一个密码吧…

2.配置反向代理(Nginx)

反代服务器我用的是Nginx, 先安装: apt install nginx. 之后需要修改位于/etc/nginx/nginx.conf的配置文件.

所有的修改都位于http模块下.

首先, 需要添加SSL设定:

http {
  #前面的东西省略

  ssl on
  ssl_certificate     /path/to/crt/chain.crt
  ssl_certificate_key /path/to/key/key.key

  #后面的也省略
}

SSL的protocols之类的设置都不用变.

然后, 在http模块的最后加上反代的配置(这个是可以在quickstart里面抄的):

http {
  #前面的东西省略

  #SSL的东西也省略

  #中间可能还有东西, 继续省略

  server {
    listen 8080; #这个是客户端访问反代服务器时的端口
    listen [::]:8080; #这个应该也是, 但是是IPv6的配置
    server_name mycodeserver.com itscodeserver.com;
    #填访问时用的域名, 可填多个, 空格分隔
    location /path/ { #等会细讲 #1
      proxy_pass http://localhost:23333/;
      #这是反代访问code-server的地址,
      #所以端口也是填code-server的端口
      proxy_redirect http:// https://;
      #把外部的https转成内部的http
      proxy_set_header Host $host:443/path;
      #等会细讲 #2
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection upgrade;
      proxy_set_header Accept-Encoding gzip;
      #最后三行不知道干嘛的, 从quickstart上直接抄下来的
    }
    #可能存在的第二个第三个location模块, 反正和上面那个差不多
  }
}

等会现在细讲 #1: 这个path是反代挂载在整个Nginx上的位置, 也就是说, 当访问https://mycodeserver.com:443/path/的时候, 就是在访问这个反代. (443是https的默认端口, 没有的话可以换成别的,并且这个端口和下面那个443是需要保持一致的)

等会现在细讲 #2: 这行的意思是把"Host"(主机)这个参数重新设定为"$path:443/path", 这样的目的是在code-server中出现URL的变化时, 会参照这个Host进行变化. 比如说, 在有密码的时候, 其URL会跳转到localhost:23333/login, 相对地, 浏览器中的URL应该是https://mycodeserver.com:443/path/login, 而不应该是https://mycodeserver.com:443/login.

不难发现, 这几行配置主要做的事情可以看作是把http://localhost:23333/全都换成了https://mycodeserver.com:443/path/.

最后service nginx restart以重启Nginx并重新配置.

PS: code-server打开文件夹是靠URL后的参数, 像这个样子:https://mycodeserver.com:443/path/?folder=vscode-remote://mycodeserver.com:443/path2yourworkspace/,如果/path/不是根目录(/)的话, 就会有一些小错误.

比如说, 我想打开的文件夹在/home/user/workspace/,其参数理应是?folder=vscode-remote://mycodeserver.com:443/home/user/workspace/,但是反代会导致它会变成?folder=vscode-remote://mycodeserver.com:443/path/home/user/workspace/,可以看到多了一个/path, 可以手动把它删掉, 并且保存在书签里, 直接点书签就好了. (实际上这个应该是Nginx的配置错误,但是既然能用我也懒得去深究了)

3.配置code-server

反代配置完成之后, 就只需要把code-server也配置成service就好了(这个也是可以在quickstart里面抄的).

[Unit]
Description=Code Server NO.1
After=network.target

[Service]
Type=simple
User=username
EnvironmentFile=/home/username/.envfile
WorkingDirectory=/home/username/
Restart=on-failure
RestartSec=10

ExecStart=/path/to/code-server/code-server --port 23333

StandardOutput=file:/path/to/output/output.log
StandardError=file:/path/to/error/error.log

[Install]
WantedBy=multi-user.target

那个EnvironmentFile就是在运行这个程序前会source的文件, 可以在里面写PASSWORD变量, 也要在PATH里面写上需要调用的程序(比如说clang)的路径, 文件名前面加点是为了隐藏文件, 实则没啥用处. 所以说, 这个文件大概应该长这样:

PASSWORD="yourpassword"
PATH="path"

PATH要是不知道填啥就把/etc/environment里面的直接拷过来就是了.

还有一个要注意的地方是, 所有出现的地址都需要填绝对地址, 不能填相对地址.

剩下的一些配置, 不是一眼就能看懂的(比如说Description), 可以自己试着改改看会有啥效果, 就是不知道它在说啥并且改了往往就会报错的玩意(比如After, Type, WantedBy). 有兴趣的话可以问搜索引擎.

最后, 把这个文件的后缀改成service并丢到/etc/systemd/system/下, 并执行systemctl restart name.service, 记得把name换成文件的名字.

如果没有任何报错, 就可以尝试用浏览器访问了, 还可以systemctl enable name.service令其开机自启.

附录: 大概是常见报错(问题)的解决方法

Q: 怎么下载二进制包到Linux机器上?A: wget , 或者curl -O , 或者WinSCP.

Q: 怎么解压.tar.gz文件?A: tar -zxvf .

Q: 文件不能拷到/etc/systemd/system/?Q: systemctl不能执行?Q: service也不能执行?Q: 修改/etc/nginx/nginx.conf显示文件只读?A: sudo.

Q: systemctl restart name.service执行后报错?A: 好好看看报错里面写了啥, 一般不是文件没以service作为后缀, 就是忘记把文件拷到/etc/systemd/system/, 或者写了非绝对地址.

Q: service restart nginx执行后报错?A: 大概是/etc/nginx/nginx.conf有语法错误, 自查一下很容易发现问题的. 可以参考nginx documentation, 或者Nginx中文文档.

Q: service文件中Type的意思?A: simple就是程序会一直在终端中运行的那种, 不Ctrl+C没法用终端的. 还有一种比较常用的类型是oneshot, 就是执行一次之后马上回到终端, 会自己注册在后台运行的, 比如vlmcsd.

Q: code-server登录时密码死活不对?A: 可能是有字符被转义了, 比如冒号和反斜杠, 要么避免这些字符, 要么再转义回去.

Q: code-server链接跳转总是跳到404的地方?A: 反代是不是哪里搞错了.

Q: code-server里打开文件夹后显示打不开文件夹?A: 和反代没挂在根目录上是差不多的问题, 手动改一下URL里面folder的地址就好了.

Q: folder后面有一堆百分号, 看得眼花缭乱?A: URL被转义了, 不难发现, %3A是冒号, %2F是斜杠, 其构成是百分号加上字符的ASCII或UTF-8的HEX形式, 对照一下就知道了.

Q: debug Golang的时候有各种错误?A: 启动code-server时加上参数--security-opt seccomp=unconfined, 用ms-vscode-go进行调试, 具体请看Issue#725.

Q: 调试vscode插件的时候各种错误?A: 这是Known Issues之一, 如下(至2020.2.11). 或者去README里面看.

  • Creating custom VS Code extensions and debugging them doesn’t work.
  • Extension profiling and tips are currently disabled.

Q: 有些插件搜不到/版本有点旧?A: 它采用的是自己的Marketplace, 可以从Extensions for Visual Studio里面找到vscode的插件并下载, 传到服务器端再通过vsix安装.

Q: 在vscode的terminal里面缺了一堆指令?A: 缺环境变量了吧, 尝试在启动code-server前运行source /etc/environment或别的有PATH的文件, 如果不是直接CLI启动(比如service)就考虑在配置文件里加环境变量.

Q: 内部的vscode无法OTA?A: 可以考虑自己patch(README里面有教程), 或者就等等新的二进制包呗.

Q: Latex Workshop的预览pdf失效?A: 在DevTools里面可以看到, 向一个五位数端口发送了一个http请求, 然后报错不允许http. 这个修起来比较复杂. 如果条件允许的话, 可以选择用vscode+Remote-SSH, 在服务器端vscode上装插件, 然后就可以看到预览了. BTW, 这个vscode和code-server是完全不冲突的, 甚至可以同时开着(vscode服务器端在本地的vscode关闭后就停止运行了), Git用的是同一个, 插件和设置是分开算的(工作区里面的设置当然还是一样的).

注: 所有的操作在Ubuntu Server 18.04下实测有效, 一些文件的位置和命令可能随环境的不同而失效.

觉得有用的话,不要吝惜评论点赞分享哦,希望大家多多包涵,有任何问题欢迎指正、讨论。本文基于CC-BY-SA 4.0协议,欢迎转载

相关推荐

3分钟让你的项目支持AI问答模块,完全开源!

hello,大家好,我是徐小夕。之前和大家分享了很多可视化,零代码和前端工程化的最佳实践,今天继续分享一下最近开源的Next-Admin的最新更新。最近对这个项目做了一些优化,并集成了大家比较关注...

干货|程序员的副业挂,12个平台分享

1、D2adminD2Admin是一个完全开源免费的企业中后台产品前端集成方案,使用最新的前端技术栈,小于60kb的本地首屏js加载,已经做好大部分项目前期准备工作,并且带有大量示例代码,助...

Github标星超200K,这10个可视化面板你知道几个

在Github上有很多开源免费的后台控制面板可以选择,但是哪些才是最好、最受欢迎的可视化控制面板呢?今天就和大家推荐Github上10个好看又流行的可视化面板:1.AdminLTEAdminLTE是...

开箱即用的炫酷中后台前端开源框架第二篇

#头条创作挑战赛#1、SoybeanAdmin(1)介绍:SoybeanAdmin是一个基于Vue3、Vite3、TypeScript、NaiveUI、Pinia和UnoCSS的清新优...

搭建React+AntDeign的开发环境和框架

搭建React+AntDeign的开发环境和框架随着前端技术的不断发展,React和AntDesign已经成为越来越多Web应用程序的首选开发框架。React是一个用于构建用户界面的JavaScrip...

基于.NET 5实现的开源通用权限管理平台

??大家好,我是为广大程序员兄弟操碎了心的小编,每天推荐一个小工具/源码,装满你的收藏夹,每天分享一个小技巧,让你轻松节省开发效率,实现不加班不熬夜不掉头发,是我的目标!??今天小编推荐一款基于.NE...

StreamPark - 大数据流计算引擎

使用Docker完成StreamPark的部署??1.基于h2和docker-compose进行StreamPark部署wgethttps://raw.githubusercontent.com/a...

教你使用UmiJS框架开发React

1、什么是Umi.js?umi,中文可发音为乌米,是一个可插拔的企业级react应用框架。你可以将它简单地理解为一个专注性能的类next.js前端框架,并通过约定、自动生成和解析代码等方式来辅助...

简单在线流程图工具在用例设计中的运用

敏捷模式下,测试团队的用例逐渐简化以适应快速的发版节奏,大家很早就开始运用思维导图工具比如xmind来编写测试方法、测试点。如今不少已经不少利用开源的思维导图组件(如百度脑图...)来构建测试测试...

【开源分享】神奇的大数据实时平台框架,让Flink&Spark开发更简单

这是一个神奇的框架,让Flink|Spark开发更简单,一站式大数据实时平台!他就是StreamX!什么是StreamX大数据技术如今发展的如火如荼,已经呈现百花齐放欣欣向荣的景象,实时处理流域...

聊聊规则引擎的调研及实现全过程

摘要本期主要以规则引擎业务实现为例,陈述在陌生业务前如何进行业务深入、调研、技术选型、设计及实现全过程分析,如果你对规则引擎不感冒、也可以从中了解一些抽象实现过程。诉求从硬件采集到的数据提供的形式多种...

【开源推荐】Diboot 2.0.5 发布,自动化开发助理

一、前言Diboot2.0.5版本已于近日发布,在此次发布中,我们新增了file-starter组件,完善了iam-starter组件,对core核心进行了相关优化,让devtools也支持对IAM...

微软推出Copilot Actions,使用人工智能自动执行重复性任务

IT之家11月19日消息,微软在今天举办的Ignite大会上宣布了一系列新功能,旨在进一步提升Microsoft365Copilot的智能化水平。其中最引人注目的是Copilot...

Electron 使用Selenium和WebDriver

本节我们来学习如何在Electron下使用Selenium和WebDriver。SeleniumSelenium是ThoughtWorks提供的一个强大的基于浏览器的开源自动化测试工具...

Quick 'n Easy Web Builder 11.1.0设计和构建功能齐全的网页的工具

一个实用而有效的应用程序,能够让您轻松构建、创建和设计个人的HTML网站。Quick'nEasyWebBuilder是一款全面且轻巧的软件,为用户提供了一种简单的方式来创建、编辑...