【開發工具】【windows】Visual Studio Code(VS Code)遠程Linux服務器環境搭建

緣起

基于以下考慮，需要搭建VS Code的遠程開發環境：

• Windows環境下，VS Code訪問本地代碼比較容易，但由于最終版本要在Linux服務器上編譯，所有本地代碼最侄訓merge或ftp覆寫，都要額外操作一次；
• 訪問Linux服務器上的檔案，也可通過samba映射本地磁盤來操作，但有時出于資訊安全的考慮，可能需要限制samba等服務，

使用vscode搭建遠程開發環境的整體架構如下：

環境及軟體

• Win 10下VS Code
  – Remote SSH
  – Remote Development
  – SSH FS
  – Compare Folders
• RHEL7下VS Code
  – VS Code Server
  – Compare Folders

除Compare Folders在服務器端安裝外，其余都是在Windows本地安裝，

操作程序

1、本地VSCode環境

• 安裝Remote SSH插件或Remote Development插件；
• 組態檔：C:\Users\Administrator.ssh\config

Host 2.100
HostName 192.168.2.100
User qxhgd
Port 22 #可選，默認是22埠
IdentityFile C:\Users\qxhgd.ssh\id_rsa.pub #可選，對免密登陸可能有用

2、遠程Linux服務器

在線安裝

操作前提：
Linux服務器自身可以連接互聯網；
VS Code已啟用remote.SSH.allowLocalServerDownload選項

• 使用vscode的remote SSH插件連接Linux服務器，則服務器會自動下載安裝vscode server，最終目錄結構如下：

[qxhgd@localhost ~]$ tree .vscode-server -L 3
.vscode-server
├── bin
│   └── 3866c3553be8b268c8a7f8c0482c0c0177aa8bfa
│       ├── bin
│       ├── extensions
│       ├── LICENSE
│       ├── node
│       ├── node_modules
│       ├── out
│       ├── package.json
│       ├── product.json
│       ├── server.sh
│       └── vscode-remote-lock.qxhgd.3866c3553be8b268c8a7f8c0482c0c0177aa8bfa
├── data
│   ├── CachedExtensionVSIXs
│   │   └── kelvin.vscode-sshfs-1.21.2
│   ├── logs
│   │   └── 20210830T061527
│   ├── Machine
│   ├── machineid
│   └── User
│       └── globalStorage
└── extensions
    └── kelvin.vscode-sshfs-1.21.2
        ├── dist
        ├── media
        ├── package.json
        ├── README.md
        ├── resources
        ├── util
        └── webview

20 directories, 10 files

主要是bin部分，另外兩部分是安裝vscode其他插件生成的，

離線安裝：

有的Linux服務器無法連接互聯網，此時又需要用vscode連接服務器，此時就需要在離線的情況下安裝vscode ；

• Windows環境下獲取VSCode的Commit ID

vscode->幫助->關于：

這里“提交”后面的字串就是Commit ID：

版本: 1.59.1 (user setup)
提交: 3866c3553be8b268c8a7f8c0482c0c0177aa8bfa
日期: 2021-08-19T11:56:46.957Z
Electron: 13.1.7
Chrome: 91.0.4472.124
Node.js: 14.16.0 V8: 9.1.269.36-electron.0
OS: Windows_NT x64 10.0.18363

• 下載對應版本的vscode server，檔案名為vscode-server-linux-x64.tar.gz：

https://update.code.visualstudio.com/commit:3866c3553be8b268c8a7f8c0482c0c0177aa8bfa/server-linux-x64/stable
這里的commit和windows下的vscode的提交（commit）建議一致；

• 在Linux服務器上按照之前在線的目錄結構，在$HOME下照著建一份：

mkdir -p ~/.vscode-server/bin
rm ~/.vscode-server/bin/* -rf 

• 在Linux服務器上按照之前在線的目錄結構，在$HOME下照著建一份：

cd ~/.vscode-server/bin
tar -zxvf vscode-server-linux-x64.tar.gz
mv vscode-server-linux-x64 3866c3553be8b268c8a7f8c0482c0c0177aa8bfa
   
touch 3866c3553be8b268c8a7f8c0482c0c0177aa8bfa/0  #有的教程里提到這個命令，但是實際在線安裝的時候，也沒有這個檔案，估計不需要，或者說新版本不需要，

3、訪問遠程目錄

• 點擊“打開檔案夾”即可：
  

4、免密登陸

• 每次登陸都輸入密碼很浪費時間，通過如下操作可實作免密登陸：

mkdir .ssh         #.ssh可能已經存在，注意不要覆寫
mv id_rsa.pub .ssh #id_rsa.pub是windows下ssh通過ssh-keygen生成的rsa公鑰，如果該目錄已經存在id_rsa.pub,不要mv覆寫，直接用上層目錄的id_rsa.pub生成authorized_keys
cd .ssh
cat id_rsa.pub >> authorized_keys
sudo chmod 600 authorized_keys
service sshd restart #不重啟可能也能生效；

其他操作技巧

• 可以給遠程VS Code安裝插件，原則上本地能安裝的，服務器上都能裝；
• 檔案對比：

a、可使用VS Code自帶的檔案比較工具：code --diff file1.cs file2.cs
b、也可使用VS Code的Compare Folders插件；
c、vscode自帶選單：右鍵第一個檔案->選擇以進行比較，右鍵第二個檔案->選擇與已選專案進行比較

• 如果本地vscode更新版本，上述程序有可能（不絕對）要重新操作一遍，

Remote SSH外的選擇

• 使用win-sshfs（純windows下獨立軟體，和vscode無關），可以將Linux服務器檔案掛載到本地；
• 使用VS Code自帶的SSH FS插件：
  

SSH FS用于傳輸檔案方便些，但是用于瀏覽檢索代碼，不怎么給力了，

• github1s、githubdev( 打開 GitHub 倉庫主頁，按一下小數點“.”這個鍵可直接跳轉)支持在頁面中的VSCode打開github倉庫，其他服務器類的，可參考搭建或實作，

參考資料

• vscode
• win-sshfs
• SSH FS使用
• how-can-i-install-vscode-server-in-linux-offline
• github1s
• githubdev

如本文對你有些許幫助，歡迎打賞：
支付寶打賞鏈接