前言

遠(yuǎn)程連接服務(wù)器的工具有很多，比如XShell、putty等，可以通過ssh來遠(yuǎn)程連接服務(wù)器，但這用于寫代碼并不方便，可能需要現(xiàn)在本地寫好代碼后再將源代碼傳送到服務(wù)器運(yùn)行、服務(wù)器上的圖片也無法直接查看。

而vscode可以很好的解決這些問題，它的核心組件都運(yùn)行在遠(yuǎn)程環(huán)境中，本地的開發(fā)機(jī)器完全不需要擁有遠(yuǎn)程開發(fā)環(huán)境的源代碼，在vscode上編寫代碼可以直接同步更新到服務(wù)器上，給你帶來絲滑般的遠(yuǎn)程開發(fā)體驗(yàn)。

所以這篇文章教程，我們將通過vscode實(shí)現(xiàn)遠(yuǎn)程開發(fā)，并通過cpolar內(nèi)網(wǎng)穿透實(shí)現(xiàn)在公網(wǎng)環(huán)境下的遠(yuǎn)程連接，讓你在出門在外任意地方也可以遠(yuǎn)程連接服務(wù)器進(jìn)行開發(fā)寫代碼。

1、安裝OpenSSH

打開Windows開始頁面，直接進(jìn)行搜索PowerShell，打開第一個(gè)Windows PowerShell，點(diǎn)擊以管理員身份運(yùn)行

打開之后，輸入以下指令：

Get-WindowsCapability -Online | ? Name -like 'OpenSSH*'

此時(shí)出現(xiàn)的結(jié)果就是電腦里沒有安裝OpenSSH的情況：

如果已經(jīng)安裝了OpenSSH那么跳過這一步，沒有安裝的話則輸入以下指令

Add-WindowsCapability -Online -Name OpenSSH.Client~~~~0.0.1.0

最終結(jié)果為如下，則代表著OpenSSH安裝成功：

顯示OpenSSH安裝成功后，在打開本地cmd進(jìn)入之后輸入命令ssh

SSH

如果顯示的是這樣結(jié)果的話，則說明正確：

2、vscode配置ssh

在windows上安裝vscode，安裝成功后并打開。

點(diǎn)擊左側(cè)工具欄中的擴(kuò)展，搜索“ssh”，選擇第一個(gè)Remote – SSH進(jìn)行安裝（我已經(jīng)安裝過了，所有此時(shí)顯示的是禁用狀態(tài)）

點(diǎn)擊左下角的“設(shè)置”按鈕，緊接著點(diǎn)擊“設(shè)置”

根據(jù)截圖的提示，找到Show Login Terminal并勾選該選項(xiàng)

點(diǎn)擊左側(cè)工具欄中的遠(yuǎn)程按鈕，可以查看遠(yuǎn)程連接，點(diǎn)擊SSH TARGETS下面顯示的服務(wù)器旁邊的按鈕進(jìn)行連接操作

3. 局域網(wǎng)測(cè)試連接遠(yuǎn)程服務(wù)器

以ssh連接ubuntu為例，打開vscode后，先嘗試使用局域網(wǎng)地址ssh遠(yuǎn)程ubuntu

輸入命令到對(duì)話框中，并回車

ssh username@ip

選擇一個(gè)配置文件

輸入完成在右側(cè)會(huì)顯示出來剛剛添加的ssh 連接,點(diǎn)擊 –>圖標(biāo) 連接,出現(xiàn)輸入密碼,輸入密碼即可

出現(xiàn)綠色標(biāo)志表示連接成功

4. 公網(wǎng)遠(yuǎn)程連接

目前我們只能在局域網(wǎng)內(nèi)進(jìn)行遠(yuǎn)程，具有一定的局限性。不過我們通過內(nèi)網(wǎng)穿透來實(shí)現(xiàn)在公網(wǎng)環(huán)境下的遠(yuǎn)程連接。這里我們借助工具cpolar內(nèi)網(wǎng)穿透來實(shí)現(xiàn)，無需公網(wǎng)IP，也不用設(shè)置路由器，操作簡(jiǎn)單。

cpolar官網(wǎng)：https://www.cpolar.com/

4.1 ubuntu安裝cpolar內(nèi)網(wǎng)穿透

本次教程我們使用的是ubuntu 圖形化系統(tǒng)，我們需要先在ubuntu上安裝配置cpolar內(nèi)網(wǎng)穿透，支持一鍵自動(dòng)安裝腳本。

• 國內(nèi)安裝

curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash

• 或 cpolar短鏈接安裝方式：(國外使用）

curl -sL https://git.io/cpolar | sudo bash

• 查看版本號(hào)，正常顯示即為安裝成功

cpolar version

• token認(rèn)證

登錄cpolar官網(wǎng)后臺(tái)，點(diǎn)擊左側(cè)的驗(yàn)證，查看自己的認(rèn)證token，之后將token貼在命令行里

cpolar authtoken xxxxxxx

• 簡(jiǎn)單穿透測(cè)試

cpolar http 8080

有正常生成相應(yīng)的公網(wǎng)地址，按ctrl c退出

• 向系統(tǒng)添加服務(wù)

sudo systemctl enable cpolar

• 啟動(dòng)cpolar服務(wù)

sudo systemctl start cpolar

• 查看服務(wù)狀態(tài)，顯示如下圖所示為active則為已啟動(dòng)狀態(tài)

sudo systemctl status cpolar

cpolar安裝并配置完成后，在瀏覽器上訪問本地9200端口，使用cpolar郵箱賬號(hào)登錄cpolar web UI管理界面

cpolar安裝成功后，默認(rèn)會(huì)安裝2條樣例隧道，可以自行編輯或者刪減：

• ssh隧道：指向本地22端口，TCP協(xié)議
• website隧道：指向本地8080端口，HTTP協(xié)議

4.2 創(chuàng)建隧道映射

我們可以直接使用樣例隧道ssh，或者重新創(chuàng)建一個(gè)隧道，使用TCP協(xié)議,指向22端口。點(diǎn)擊左側(cè)儀表盤的隧道管理——?jiǎng)?chuàng)建隧道

• 隧道名稱：可自定義，注意不要重復(fù)
• 協(xié)議：tcp
• 本地地址：22
• 端口類型：隨機(jī)臨時(shí)TCP端口
• 地區(qū)：china vip

點(diǎn)擊創(chuàng)建

隧道創(chuàng)建成功后，點(diǎn)擊左側(cè)的狀態(tài)——在線隧道列表，可以看到，剛剛創(chuàng)建的隧道已經(jīng)有生成了相應(yīng)的公網(wǎng)地址，將其復(fù)制下來

4.3 測(cè)試公網(wǎng)遠(yuǎn)程連接

在windows上打開vscode，使用所復(fù)制的公網(wǎng)地址來遠(yuǎn)程SSH。

點(diǎn)擊SSH TARGETS下面顯示的服務(wù)器旁邊的按鈕進(jìn)行連接操作。

如左側(cè)沒有出現(xiàn)添加的連接,點(diǎn)如下按鈕刷新

接著點(diǎn)擊小箭頭 –> 連接,出現(xiàn)選擇ssh 類型,選擇linux

輸入?yún)?shù),和密碼即可遠(yuǎn)程成功,方便快捷。

出現(xiàn)以下信息表示遠(yuǎn)程連接成功

5. 配置固定TCP端口地址

由于以上所創(chuàng)建的隧道選擇的是隨機(jī)臨時(shí)TCP端口，所生成的公網(wǎng)地址會(huì)在24小時(shí)內(nèi)隨機(jī)變化，對(duì)于需要長期遠(yuǎn)程的用戶來講不方便。不過我們可以為其配置固定的地址進(jìn)行遠(yuǎn)程連接，后續(xù)遠(yuǎn)程無需先查看隨機(jī)公網(wǎng)地址再進(jìn)行遠(yuǎn)程。

注意：配置固定TCP端口地址功能需要升級(jí)至專業(yè)版套餐或以上才支持。

5.1 保留一個(gè)固定TCP端口地址

打開cpolar官網(wǎng)，登錄到官網(wǎng)后臺(tái)https://dashboard.cpolar.com/reserved,點(diǎn)擊左側(cè)的預(yù)留，我們來保留一個(gè)固定TCP端口地址：

• 地區(qū)：選擇china
• 描述：即備注，可自定義

地址保留成功后，系統(tǒng)會(huì)生成相應(yīng)的固定公網(wǎng)地址，將其復(fù)制下來

5.2 配置固定TCP端口地址

在ubuntu系統(tǒng)上打開瀏覽器訪問本地9200端口，登錄cpolar web UI管理界面。點(diǎn)擊左側(cè)的隧道管理——隧道列表，找到ssh隧道，點(diǎn)擊右側(cè)的編輯，我們來修改隧道信息，將固定tcp端口地址配置到隧道中

修改隧道信息，將保留成功的固定tcp地址配置到隧道中

• 端口類型：修改為固定tcp端口
• 預(yù)留的tcp地址：填寫保留成功的地址

點(diǎn)擊更新

隧道更新成功后，點(diǎn)擊左側(cè)儀表盤的狀態(tài)——在線隧道列表，找到SSH隧道，可以看到公網(wǎng)地址已經(jīng)更新成為了固定tcp地址。

5.3 測(cè)試固定公網(wǎng)地址遠(yuǎn)程

打開vscode,選擇添加一個(gè)ssh連接

使用保留的tcp地址連接

刷新一下

刷新出來地址,點(diǎn)擊右邊小箭頭”–>”連接,出現(xiàn)以下提示,輸入yes

出現(xiàn)綠色信息,表示連接成功。