如何本地區域網下訪問vue專案？【手機和電腦均可】
阿新 • • 發佈：2020-10-21
在學習vue的時候，在電腦上跑起來，總喜歡還能在別的電腦或者自己手機上能看見，這就需要小小的配置一下
win10設定
需要配置一下電腦的防火牆，把所需的埠（如：8080）開啟。
設定方法如下：
-
Windows 10 ，搜尋“控制面板”，開啟，Windows 7 可以直接在開始選單開啟。
-
點選“Windows Defender防火牆”——“高階設定”——新建“入網規則”。
-
規則型別選擇“埠”
-
下一步“特定本地埠”填 8080-8088 （此處是一個 IP 段，因為如果開啟多個專案，埠會被佔用， Vue會自動分配一個新的埠。如：8081 ）。
-
下一步“允許連線”
-
下一步選擇開放的場景，注意一定要選前兩個
- 下一步輸入規則名稱，點選“完成”即可
這樣用手機訪問電腦 IP 加埠號，192.168.1.11:8080 就可以開啟專案了。
注意：手機和電腦必須在同一區域網下才能訪問，同事電腦同理
獲取IP 方法：
開啟命令提示行工具，輸入 ipconfig 回車, 就可以看到自己的IP了，比如我的 192.168.2.103 。
Vue專案無法使用區域網IP直接訪問的配置方法 經驗總結 第3張
這樣更加方便真機除錯，無需部署到伺服器就可以進行訪問和測試。
**注意：**如果專案使用的是筆記本啟動的，而且還是連的WiFi，那麼需要訪問的ip應該是無線IP
其實在npm run serve啟動vue專案的時候，控制檯就有顯示網路訪問的IP地址，複製訪問即可。
