Linux伺服器部署Web版VSCode,在window下使用瀏覽器在linux環境下編寫程式碼

web喵神發表於2024-03-27

最近嘗試了一下在Linux伺服器上部署VSCode,也就是code-server,然後在windows電腦上透過瀏覽器訪問開啟線上編輯器編寫程式碼,以下記錄一下部署過程。

1、在linux伺服器上安裝code-server

a、進入到home目錄下

b、建立vscode目錄

c、進入vscode目錄

d、使用wget命令下載code-server壓縮包,我這裡安裝的是4.9.1版本

e、使用tar命令解壓壓縮包

cd /home
mkdir vscode
cd vscode
wget https://github.com/coder/code-server/releases/download/v4.9.1/code-server-4.9.1-linux-amd64.tar.gz
tar -xvf code-server-4.9.1-linux-amd64.tar.gz

2、解壓完成後,進入bin目錄,執行以下命令

a、進入code-server-4.9.1-linux-amd64/bin目錄

b、執行 ./code-server 命令

cd code-server-4.9.1-linux-amd64/bin
./code-server

c、第一次執行完 ./code-server 命令後,會在使用者目錄/.config/code-server下生成一個 config.yaml的配置檔案,如圖:

d、先使用Ctrl+C組合鍵退出code-server服務,使用 vi /root/.config/code-server/config.yaml 命令開啟配置config.yaml檔案,根據需要修改ip、埠和登入密碼:

e、由於我這裡是配置的8081埠,所以需要伺服器放開8081埠,可以在自己的阿里雲或者騰旭雲服務控制後臺的安全組新增8081埠,並設定策略為允許,如下圖:

f、進入/home/vscode/code-server-4.9.1-linux-amd64/bin 目錄下,執行 ./code-server 命令,啟動code-server服務

g、此時在自己的window電腦上就可以透過:伺服器ip:8081 來訪問web版的vscode了,效果如下圖:

第一次訪問需要輸入之前在config.yaml配置檔案裡設定的登入密碼(123456),就可以愉快的在瀏覽器下寫程式碼了

3、設定code-server服務保持後臺線上

但是到這裡還有一個問題,當前這種執行是在前臺執行的,不是在後臺執行的,如果執行這個code-server的話,就需要保持code-server一直在前臺執行,我們的伺服器就不能做其他操作了,這時我們需要使用systemctl管理來執行code-server,把code-server變成一個系統服務,可以在後臺執行。操作如下:

a、使用cd命令進入 /etc/systemd/system/ 目錄下

cd /etc/systemd/system/

b、使用touch命令新建一個code-server.service檔案

touch code-server.service

c、使用vim編輯code-server.service為如下內容

[Unit]
Description=code-server
After=network.target

[Service]
Type=exec
ExecStart=/home/vscode/code-server-4.9.1-linux-amd64/bin/code-server
Restart=always
User=root

[Install]
WantedBy=default.target

ExecStart是code-server指令所在的地址,咱們的剛剛執行code-server的時輸入的linux指令code-server後所執行的就是/home/vscode/code-server-4.9.1-linux-amd64/bin/code-server這個可執行檔案

以後就可以以下命令啟動、重啟、停止或解除安裝code-server服務了:

啟動code-server:

sudo systemctl start code-server

重啟code-server:

sudo systemctl status code-server

停止code-server:

sudo systemctl stop code-server

解除安裝code-server(解除安裝之前先停止code-server)

rm -rf /home/vscode
rm -rf ~/.local/share/code-server
rm -rf ~/.config/code-server
rm -rf /etc/systemd/system/code-server.service

相關文章