欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

用VSCode實(shí)現(xiàn)內(nèi)網(wǎng)穿透的步驟詳解

 更新時(shí)間:2023年12月20日 08:37:22   作者:程序員大澈  
這篇文章給大家介紹了如何用VSCode實(shí)現(xiàn)內(nèi)網(wǎng)穿透,文中通過圖文結(jié)合的方式給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下

1. 需求分析

不知道大家有沒有遇到過這種情況。

就是說,我們?cè)诒镜嘏芰艘粋€(gè)項(xiàng)目服務(wù),項(xiàng)目地址為localhost,此時(shí)我們想把項(xiàng)目demo發(fā)給測(cè)試或其他人看一下,該怎么辦呢?

下面給出兩種解決方案。

如果自己和同事都是使用的公司內(nèi)網(wǎng),那就比較簡(jiǎn)單了。把localhost更換為局域網(wǎng)內(nèi)自己的IP地址,別人就可以直接訪問了。

如果自己和同事不在一個(gè)局域網(wǎng)內(nèi),即大家不在一個(gè)地方辦公,這就比較麻煩了。通常是需要重新構(gòu)建服務(wù)器,讓別人去訪問項(xiàng)目的公網(wǎng)地址。

但這樣就會(huì)有一個(gè)問題,倘若每次對(duì)項(xiàng)目做了修改,就必須每次重新提交代碼并重新構(gòu)建服務(wù)器,才能讓別人同步看到更改,這樣做非常低效與麻煩。

所以就有了我們今天說的,用內(nèi)網(wǎng)穿透來解決這個(gè)問題。這里使用的工具,是VSCode 1.82 版本推出的一個(gè)名為本地端口轉(zhuǎn)發(fā)的功能,簡(jiǎn)單方便!

2. 功能實(shí)現(xiàn)

先給小白朋友解釋一下內(nèi)網(wǎng)穿透,然后再列一列功能實(shí)現(xiàn)步驟。

2.1 啥是內(nèi)網(wǎng)穿透?

簡(jiǎn)單理解一下,主打一個(gè)貼心:

內(nèi)網(wǎng)穿透,就是通過一個(gè)公網(wǎng)服務(wù)器作為中轉(zhuǎn),將本地的端口映射到互聯(lián)網(wǎng)上。

然后再用專業(yè)術(shù)語詳細(xì)解釋一下:

內(nèi)網(wǎng)穿透(NAT穿透)是一種網(wǎng)絡(luò)技術(shù),用于在私有網(wǎng)絡(luò)(如局域網(wǎng))中訪問位于公共網(wǎng)絡(luò)(如互聯(lián)網(wǎng))上的設(shè)備或服務(wù)。

在一個(gè)典型的網(wǎng)絡(luò)環(huán)境中,私有網(wǎng)絡(luò)中的設(shè)備使用私有IP地址,而公共網(wǎng)絡(luò)中的設(shè)備使用公共IP地址。由于私有IP地址在公共網(wǎng)絡(luò)中不可直接訪問,因此需要通過內(nèi)網(wǎng)穿透技術(shù)來實(shí)現(xiàn)私有網(wǎng)絡(luò)中設(shè)備的訪問。

內(nèi)網(wǎng)穿透通過在公共網(wǎng)絡(luò)上建立一個(gè)轉(zhuǎn)發(fā)通道,將公共網(wǎng)絡(luò)中的請(qǐng)求轉(zhuǎn)發(fā)到私有網(wǎng)絡(luò)中的設(shè)備上,從而實(shí)現(xiàn)對(duì)私有網(wǎng)絡(luò)中設(shè)備的訪問。

它通常涉及到使用一個(gè)中間服務(wù)器或服務(wù),該服務(wù)器位于公共網(wǎng)絡(luò)中,并具有公共IP地址。私有網(wǎng)絡(luò)中的設(shè)備通過與中間服務(wù)器建立連接,并在連接建立后,通過中間服務(wù)器傳輸數(shù)據(jù)。

內(nèi)網(wǎng)穿透技術(shù)在以下情況下非常有用:

  • 訪問位于私有網(wǎng)絡(luò)中的設(shè)備或服務(wù),如家庭網(wǎng)絡(luò)中的攝像頭、文件共享服務(wù)器等。
  • 遠(yuǎn)程管理或訪問位于私有網(wǎng)絡(luò)中的設(shè)備,如遠(yuǎn)程桌面、SSH訪問等。
  • 在開發(fā)和測(cè)試環(huán)境中,通過公共網(wǎng)絡(luò)訪問局域網(wǎng)中的應(yīng)用程序或服務(wù)。

常見的內(nèi)網(wǎng)穿透工具或服務(wù),包括:ngrok、frp、花生殼等。它們提供了簡(jiǎn)單的配置和管理界面,使用戶能夠快速設(shè)置和使用內(nèi)網(wǎng)穿透功能。

需要注意的是,使用內(nèi)網(wǎng)穿透將私有網(wǎng)絡(luò)中的設(shè)備暴露在公共網(wǎng)絡(luò)中,因此需要采取適當(dāng)?shù)?code>安全措施,如使用安全協(xié)議(如HTTPS)、訪問控制列表(ACL)等,以保護(hù)設(shè)備和數(shù)據(jù)的安全性。

2.2 本地端口轉(zhuǎn)發(fā)使用步驟

先在本地啟動(dòng)你的項(xiàng)目服務(wù),比如使用 vite 啟動(dòng)一個(gè)項(xiàng)目,端口號(hào)為 5173。

然后切換到 端口 視圖,點(diǎn)擊 轉(zhuǎn)發(fā)端口 按鈕。

輸入端口號(hào) 5173,確認(rèn)后如果你沒有登錄 GitHub 賬號(hào),會(huì)提示你登錄,按照提示全部允許操作即可,授權(quán)成功后會(huì)自動(dòng)跳轉(zhuǎn)回VSCode。

最后,復(fù)制轉(zhuǎn)發(fā)地址,發(fā)給需要的人。

2.3 一些重要的使用說明

默認(rèn)情況下,轉(zhuǎn)發(fā)的端口是私有的,只有使用同一個(gè) GitHub 賬號(hào)登錄的用戶才能訪問。

如果你想要公開你的服務(wù),讓任何人都可以訪問,你可以在 端口 視圖中右鍵點(diǎn)擊 端口可見性,選擇 公共 即可。

如果用戶第一次使用這個(gè)功能進(jìn)行訪問,打開網(wǎng)址時(shí)會(huì)出現(xiàn)一些提示說明,直接點(diǎn)擊 繼續(xù) 正常訪問即可。

結(jié)語

建立這個(gè)平臺(tái)的初衷:

  • 打造一個(gè)僅包含前端問題的問答平臺(tái),讓大家高效搜索處理同樣問題。
  • 通過不斷積累問題,一起練習(xí)邏輯思維,并順便學(xué)習(xí)相關(guān)的知識(shí)點(diǎn)。
  • 遇到難題,遇到有共鳴的問題,一起討論,一起沉淀,一起成長。

以上就是用VSCode實(shí)現(xiàn)內(nèi)網(wǎng)穿透的步驟詳解的詳細(xì)內(nèi)容,更多關(guān)于VSCode實(shí)現(xiàn)內(nèi)網(wǎng)穿透的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!

相關(guān)文章

最新評(píng)論