Vue2項目無法使用局域網IP直接訪問的配置方法


需要配置一下,才可直接用局域網 IP 訪問,方法如下:

給 dev 添加--host 0.0.0.0 屬性:

"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0",
"start": "npm run dev",
"unit": "jest --config test/unit/jest.conf.js --coverage",
"test": "npm run unit",
"build": "node build/build.js"
},
這樣就可以用手機訪問電腦的 IP 直接打開項目網站了。

如果還是無法訪問,需要配置一下電腦的防火牆,把所需的端口(如:8080)打開。

設置方法如下:

Windows 10 ,搜索“控制面板”,打開,Windows 7 可以直接在開始菜單打開。

點擊“Windows Defender防火牆”——“高級設置”——新建“入網規則”。

規則類型選擇“端口”,下一步“特定本地端口”填 8080-8088 (此處是一個 IP 段,因為如果打開多個項目,端口會被占用, Vue會自動分配一個新的端口。如:8081 )。

Vue項目無法使用局域網IP直接訪問的配置方法 經驗總結 第2張

下一步“允許連接”,下一步選擇開放的場景,我選的是前兩個,下一步輸入規則名稱,點擊“完成”即可。

這樣用手機訪問電腦 IP 加端口號,192.168.1.11:8080 就可以打開項目了。

獲取電腦 IP 的方法:

Win + R 運行“cmd”,輸入 ipconfig 回車, 就可以看到自己的IP了,比如我的 192.168.2.103 。

Vue項目無法使用局域網IP直接訪問的配置方法 經驗總結 第3張

這樣更加方便真機調試,無需部署到服務器就可以進行訪問和測試。

原文:[https://www.cnblogs.com/deshun/p/12075520.html]


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM