vue項目中的遇錯:Invalid?Host?header問題
更新時間：2023年07月26日 08:32:39 作者：sayyy
這篇文章主要介紹了vue項目中的遇錯:Invalid?Host?header問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
vue項目遇錯:Invalid Host header
現(xiàn)象
在A服務(wù)器上使用npm run serve 啟動項目，訪問A服務(wù)器的地址，無錯誤。
在B服務(wù)器上使用nginx代理到A服務(wù)器，訪問B服務(wù)器的地址，遇錯“Invalid Host header”。
解決辦法
在vue.config.js的devServer節(jié)點下加入disableHostCheck: true配置項。
vue-cli4.x項目啟動本地出現(xiàn) invalid host header的原因
近段時間有個項目是單點登錄的，項目里需要獲取用戶token，故本地配置host文件來訪問線上項目，拿到cookie存儲的用戶token，所以配置了hosts文件。
之前用過vue-cli2.x,我們只需要配飾hosts文件就可以了。
因為webpack是默認設(shè)置可配置host，但是新版的vue-cli4.x將這項配置獨立出來，需要我們手動配置，其實也很簡單，只需在vue.config.js文件中添加一個屬性并設(shè)置值為true
module.exports ={
devServer: {
// 本地配置host生效
disableHostCheck:true,
},
}總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue resource post請求時遇到的坑,需要的朋友可以參考下2017-10-10
在Vue3項目中,通常會有以下一些常見的目錄和文件,下面這篇文章主要給大家介紹了關(guān)于vue3項目中各個文件的作用,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-09-09
vue 動態(tài)添加class,三個以上的條件做判斷方式
這篇文章主要介紹了vue 動態(tài)添加class,三個以上的條件做判斷方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11
vite項目的根目錄中的env.d.ts類型聲明文件里要寫什么
這篇文章主要介紹了vite項目的根目錄中的env.d.ts類型聲明文件里要寫什么,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要介紹了如何利用vue寫一個日歷，幫助大家更好的理解和學習vue，感興趣的朋友可以了解下2020-11-11
這篇文章主要介紹了vue.js踩坑之ref引用細節(jié)點講解，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
Vue?Router路由hash模式與history模式詳細介紹
Vue?Router是Vue.js官方的路由管理器。它和Vue.js的核心深度集成，讓構(gòu)建單頁面應(yīng)用變得易如反掌。路由實際上就是可以理解為指向，就是我在頁面上點擊一個按鈕需要跳轉(zhuǎn)到對應(yīng)的頁面，這就是路由跳轉(zhuǎn)2022-08-08
這篇文章主要為大家詳細介紹了Vue.js數(shù)字輸入框組件的使用方法，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10
這篇文章主要介紹了vue diff算法的使用，幫助大家更好的理解和學習使用vue，感興趣的朋友可以了解下2021-04-04
vue flex 布局實現(xiàn)div均分自動換行的示例代碼
這篇文章主要介紹了vue flex 布局實現(xiàn)div均分自動換行,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-08-08