如何讓IPad變成你的生產(chǎn)力工具？在IPad上用Vscode寫代碼搞開發(fā)
這個(gè)教程將實(shí)現(xiàn)如何在ipad中使用VScode編寫代碼，再通過cpolar穿透本地code-server服務(wù),使得遠(yuǎn)程可以進(jìn)行訪問,隨時(shí)隨地寫代碼。
1. 本地環(huán)境配置
準(zhǔn)備一臺(tái)虛擬機(jī),Ubuntu或者centos都可以,這里以VMware Ubuntu系統(tǒng)為例
下載code server服務(wù)
在瀏覽器訪問:https://github.com/coder/code-server,復(fù)制下載命令
打開ubuntu命令行執(zhí)行
curl -fsSL https://code-server.dev/install.sh | sh
出現(xiàn)需要輸入ubuntu的登錄賬戶密碼,輸入密碼即可,然后等待安裝完成
以下信息表示安裝成功
接著輸入以下命令設(shè)置code-server的登錄密碼
export PASSWORD="000000"
查看IP地址,作局域網(wǎng)訪問使用
ifconfig
設(shè)置好密碼后啟動(dòng)code-server服務(wù),輸入以下命令:
code-server --host= "0.0.0.0"
出現(xiàn)地址和端口號信息表示成功
接著打開瀏覽器通過局域網(wǎng)訪問http://192.168.30.128:8080/,出現(xiàn)welcone code-server表示成功,輸入我們設(shè)置的密碼,登錄即可。
2. 內(nèi)網(wǎng)穿透
接著我們使用cpolar穿透本地code-server服務(wù),使得遠(yuǎn)程可以進(jìn)行訪問,隨時(shí)隨地寫代碼。cpolar支持http/https/tcp協(xié)議，不限制流量，操作簡單，無需公網(wǎng)IP，也無需路由器。
cpolar官網(wǎng)：https://www.cpolar.com/
2.1 安裝cpolar內(nèi)網(wǎng)穿透(支持一鍵自動(dòng)安裝腳本)
cpolar 安裝（國內(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
查看版本號
cpolar version
token認(rèn)證
登錄cpolar官網(wǎng)后臺(tái)，點(diǎn)擊左側(cè)的驗(yàn)證，查看自己的認(rèn)證token，之后將token貼在命令行里
cpolar authtoken xxxxxxx
簡單穿透測試
cpolar http 8080
按ctrl+c退出
向系統(tǒng)添加服務(wù)
sudo systemctl enable cpolar
啟動(dòng)cpolar服務(wù)
sudo systemctl start cpolar
查看服務(wù)狀態(tài)
sudo systemctl status cpolar
正常顯示為active則表示服務(wù)為正常在線啟動(dòng)狀態(tài)
2.2 創(chuàng)建HTTP隧道
在ubuntu系統(tǒng)本地安裝cpolar內(nèi)網(wǎng)穿透之后，在ubuntu瀏覽器上訪問本地9200端口，打開cpolar web ui界面:。
點(diǎn)擊左側(cè)儀表盤的隧道管理——?jiǎng)?chuàng)建隧道,由于code-server中配置的是8080端口，因此我們要來創(chuàng)建一條http隧道，指向8080端口：
隧道名稱：可自定義，注意不要重復(fù)
協(xié)議：http協(xié)議
本地地址：8080
域名類型：選擇隨機(jī)域名
地區(qū)：選擇China VIP
點(diǎn)擊創(chuàng)建
創(chuàng)建好后,點(diǎn)擊左側(cè)的狀態(tài)——在線隧道列表,查看公網(wǎng)地址，將其復(fù)制下來
3. 測試遠(yuǎn)程訪問
打開ipad瀏覽器,輸入剛剛復(fù)制的公網(wǎng)地址訪問即可,訪問后輸入前面設(shè)置的密碼,出現(xiàn)vscode界面表示成功
4. 配置固定二級子域名
4.1 保留二級子域名
由于以上使用cpolar所創(chuàng)建的隧道使用的是隨機(jī)臨時(shí)公網(wǎng)地址，該地址在24小時(shí)內(nèi)會(huì)發(fā)生變化，不利于長期遠(yuǎn)程訪問。因此我們可以為其配置二級子域名，該地址為固定地址，不會(huì)隨機(jī)變化【ps：cpolar.cn已備案】
需要注意，配置固定二級子域名需要將cpolar升級到基礎(chǔ)套餐或以上。
登錄cpolar官網(wǎng)，點(diǎn)擊左側(cè)的預(yù)留，選擇保留二級子域名，設(shè)置一個(gè)二級子域名名稱，點(diǎn)擊保留,保留成功后復(fù)制保留的二級子域名名稱
地區(qū)：選擇China vip
二級域名：可自定義填寫
描述：即備注，可自定義填寫
4.2 配置二級子域名
訪問本地9200端口，打開cpolar web ui 界面，點(diǎn)擊左側(cè)的隧道管理——隧道列表，找到vscode隧道，點(diǎn)擊右側(cè)的編輯
修改下隧道信息：
域名類型改為選擇二級子域名
subdomain：填寫剛剛保留成功的二級子域名
點(diǎn)擊更新
隧道更新成功之后，點(diǎn)擊左側(cè)的狀態(tài)——在線隧道列表,查看公網(wǎng)地址,此時(shí)可以看到地址變成了二級域名，將其復(fù)制下來
5. 測試使用固定二級子域名遠(yuǎn)程訪問
接著我們再次打開ipad瀏覽器，訪問剛剛配置成功的固定二級子域名地址,出現(xiàn)vscode界面表示成功,就可以愉快的寫代碼啦.
6. iPad通過軟件遠(yuǎn)程vscode
接下來我們通過servediter for code-server軟件來實(shí)現(xiàn)ipad遠(yuǎn)程訪問vscode
6.1 創(chuàng)建TCP隧道
首先需要?jiǎng)?chuàng)建一條TCP隧道，指向我們服務(wù)器的22端口,servediter for code-server這個(gè)軟件需要連接服務(wù)器,在ubuntu上打開瀏覽器訪問本地9200端口，登錄cpolar web ui界面,點(diǎn)擊左側(cè)的隧道管理——?jiǎng)?chuàng)建隧道
隧道名稱：可自定義，注意不要重復(fù)
協(xié)議：tcp協(xié)議
本地地址：22
域名類型：選擇隨機(jī)臨時(shí)TCP端口
地區(qū)：選擇China VIP
點(diǎn)擊創(chuàng)建
隧道創(chuàng)建成功之后，點(diǎn)擊左側(cè)的狀態(tài)——在線隧道列表，將所生成的公網(wǎng)地址復(fù)制下來。
7. ipad遠(yuǎn)程vscode
在ipad上，點(diǎn)擊打開appstore，下載軟件servediter for code-server
下載成功后點(diǎn)擊打開，由于該軟件是付費(fèi)的,可以自由選擇購買,這里選擇免費(fèi)試用，選擇最后一個(gè)free
輸入相關(guān)信息
參數(shù)介紹:
code-server URL：填寫前面配置成功的http公網(wǎng)地址【ipad瀏覽器訪問的那個(gè)地址】
Instance password：code-server配置的密碼
Host：這里填寫我們前面創(chuàng)建成功的22隧道的公網(wǎng)地址
Username: 這個(gè)填寫ubuntu系統(tǒng)的用戶名
Port: 這里默認(rèn)即可無需填寫
Authentication: 這個(gè)填寫ubuntu系統(tǒng)用戶名對應(yīng)的密碼
輸入完信息后點(diǎn)擊右上角save后就會(huì)自動(dòng)連接,出現(xiàn)vscode界面表示連接成功啦
8. 配置固定TCP端口地址
由于前面我們創(chuàng)建的ssh 22端口的隧道選擇的是隨機(jī)臨時(shí)地址,該地址會(huì)在24小時(shí)內(nèi)變化,為了使我們ipad里面使用vscode連接更加通暢,我們需要固定ssh 的公網(wǎng)地址。
注意需要將cpolar套餐升級至專業(yè)套餐或以上。
8.1 保留固定TCP地址
登錄cpolar，點(diǎn)擊左側(cè)的預(yù)留，找到保留的TCP地址：
地區(qū)：選擇China VIP
描述：即備注，可自定義填寫
點(diǎn)擊保留
固定TCP地址保留成功，系統(tǒng)生成相應(yīng)的公網(wǎng)地址+固定端口號，將其復(fù)制下來
8.2 配置固定TCP端口地址
瀏覽器訪問http://127.0.0.1:9200/登錄cpolar web UI管理界面，點(diǎn)擊左側(cè)儀表盤的隧道管理——隧道列表，找到codeserver隧道，點(diǎn)擊右側(cè)的編輯
修改隧道信息，配置固定TCP端口地址：
端口類型：改為選擇固定TCP端口
預(yù)留的TCP地址：填寫剛剛保留成功的固定TCP端口地址
點(diǎn)擊更新
提示更新隧道成功，點(diǎn)擊左側(cè)儀表盤的狀態(tài)——在線隧道列表，可以看到剛剛修改的隧道的公網(wǎng)地址已經(jīng)更新為固定TCP端口地址，將其復(fù)制下來。
9. 使用固定TCP地址遠(yuǎn)程vscode
在ipad上，打開servediter for code-server軟件，修改host的參數(shù)，將其修改為我們剛剛配置成功的固定TCP端口地址。
點(diǎn)擊左上角i標(biāo)志
選擇self Host Server
把Host值改為我們剛剛官網(wǎng)保留的tcp地址
更改完后點(diǎn)擊右上角save,點(diǎn)擊完后會(huì)自動(dòng)連接,出現(xiàn)vscde界面表示成功了,至此,教程就結(jié)束了,使用ipad開啟愉快的編程吧！該公網(wǎng)地址不會(huì)再隨機(jī)變化了。
