Vue CLl 出现 Invalid Host header

最新推荐文章于 2024-03-29 18:15:45 发布
最新推荐文章于 2024-03-29 18:15:45 发布
阅读量220 收藏
点赞数
分类专栏： Vue 文章标签： vue
MW
本文链接：https://blog.csdn.net/qq_42222342/article/details/104988461
版权

产生原因

新版的webpack-dev-server增加了安全验证，默认检查hostname，如果hostname不是配置内的，将中断访问。

解决方案

在根目录下创建文件vue.config.js，然后填入如下内容

disableHostCheck: true,

在这里插入图片描述

MW0309
关注
专栏目录
全网多种方法解决Invalid Host header(无效的主机头)服务器域名访问出现的错误
念兮为美
02-26 1万+
全网多种方法解决Invalid Host header(无效的主机头)服务器域名访问出现的错误。Invalid Host header是一个常见的错误信息，通常发生在`Web`应用程序中。它表示HTTP请求中的Host header（主机头）与实际请求的主机不匹配，这可能是由于代理服务器或负载均衡器等网络设备引起的。通过检查你的应用程序配置并确保正确的主机名，你应该能够解决此问题。无论你采取哪种解决方案，请务必小心。确保你理解你所做的更改，并在测试之前备份所有配置文件和代码。
解决vue项目中出现Invalid Host header的问题
01-18
在vue-cli版本为2.x的情况下修改webpack.dev.conf.js中的devServer对象加入disableHostCheck: true devServer: { disableHostCheck: true, } vue-cli版本3.0的情况下修改vue.config.js的配置 module.exports = { devServer: { disableHostCheck: true } } 补充知识：vue中使用wangeditor富文本编辑器 1.先下载 编辑器 cnpm install wangeditor –save 2.用法： 2.1、html
vue项目中的“Invalid Host header”
彭世瑜的博客
01-06 2183
修改vue.config.js的配置 devServer: { disableHostCheck: true, }
vue项目中报错“Invalid Host header”
我的米饭
03-31 640
转自：https://www.xuanmo.xin/details/2869 更改本机的HOST文件后，访问解析后的本地域名时报错 “Invalid Host header”， 解决方法：在vue-cli版本为2.x的情况下修改 webpack.dev.conf.js 中的 devServer 对象加入 disableHostCheck: true 即可转发成功 devServer: { disableHostCheck: true, } ...
vue 项目中访问出现 Invalid Host header
梦翼横空的专栏
07-28 330
vue项目使用访问正常因业务需要修改了一下host(C:\Windows\System32\drivers\etc\hosts)
详解@Vue/Cli 3 Invalid Host header 错误解决办法
12-09
在开发Vue.js应用程序时，你可能会遇到一个名为`Invalid Host header`的错误，尤其是在使用@Vue/Cli 3工具链时。这个错误通常出现在你尝试在非标准的或自定义的HTTP主机头环境下运行Vue CLI的开发服务器时。在本文中...
vue-cli配置域名访问报错：Invalid Host header（无效的主机头）
qq_40678503的博客
10-21 2223
在开发vue-cli脚手架项目的时候，配置了host : 127.0.0.1 dev.com 想通过dev.com:8080去访问项目，dev.com这个域名后端已经配置好了跨域 但是访问的时候会报Invalid Host header（无效的主机头）错误 上解决方法： 要修改webpack的配置，在项目的根目录下增加vue.config.js 文件 module.exports = { productionSourceMap: false, devServer: { historyApi
vue内网穿透问题：Invalid Host header
楊帥
04-06 3091
问题背景： 为了能让外网访问我的电脑，使用了内网穿透Ngrok，然后用vue-cli3创建了vue项目，项目运行正常，用Ngrok提供的地址访问，Ngrok显示200访问成功，但是网页上确提示错误Invalid Host header 解决办法： 项目创建的时候是没有vue.config.js文件的，需要自己手动创建一个 然后编写： module.exports = { devServer: { open: true,//启动项目后自动开启浏览器 disableHostCheck:
vue 项目内网穿透报错Invalid Host header
weixin_46095200的博客
08-18 456
我在进行的时候遇到两个问题，一个是项目带不开，说服务器没有启动 另外一个是Invalid Host header 第一个问题解决： 项目要有跳转地址 第二个问题 在vue-cli版本为2.x的情况下修改webpack.dev.conf.js中的devServer对象加入disableHostCheck: true即可转发成功 devServer: { disableHostCheck: true, } vue-cli版本3.0的情况下修改vue.config.js的配置 module.expo.
vue项目本地映射到外网访问时出现 Invalid Host header
不忘的博客
11-19 1067
新版的webpack-dev-server增加了安全验证，默认检查hostname，如果hostname不是配置内的，将中断访问。通过公网访问本机运行的vue项目，访问时遇到的问题。
codeSendbox导入vue项目提示“Invalid Host header”
weixin_54968142的博客
12-12 119
这个文章可能是webpack4或者更早，现在默认vue脚手架生成的都是webpack5，做参考。第二个就是不做校验，在vue.config.js中加入如下配置。这个是webpack5中的配置，webpack4中的配置是。第一种方式配置白名单。
Nginx 代理Vue项目出现Invalid Host header
天河有尽后为涯，星海无边前作岸。
07-10 1834
使用 Nginx 的对项目做负载均衡时，代理的地址无法访问目标地址，且页面报错：Invalid Host header（无效主机头）
vue項目运行 报错 invalid host header
palmer_kai的博客
04-04 499
preview 该问题 第二次出现了，这里记录下， 方便查找 解决方式如下 在 webpack.dev.conf.js 文件中添加如下代码： disableHostCheck: true 即可解决问题
Vue——解决 Vue 项目 invalid host header 问题
weixin_43551242的博客
08-31 1755
解决 invalid host header 问题
vue 解决Invalid Host header
weixin_45773421的博客
08-25 1028
ue 解决Invalid Host header 在build/webpack.dev.conf.js文件中，加上disableHostCheck: true、如下图：
解决vue项目中的“Invalid Host header”
最新发布
踏上征程
03-29 981
最近在做一个微信公众号项目，用微信开发工具调试本地项目，需要做一下内网穿透，代理都配置好了，页面出现这个Invalid Host header错误，内网穿透工具我是用的frps做的，最后通过google找到方法，在vue-cli版本为2.x的情况下修改webpack.dev.conf.js中的devServer对象加入disableHostCheck: true即可转发成功。PS:本人五年工作经验想寻求长期兼职（远程办公）~有个人项目或企业项目部署维护类的老板可私聊我~
Vue 项目中出现 Invalid Host header 解决办法
qq_44290077的博客
08-31 2169
问题提出 当使用 natapp ，对 Vue 项目进行内网穿透时，访问项目外网网址出现 Invalid Host header 情况。 解决方法 在项目的根目录下，应该有一个 vue.config.js 文件，如果没有直接新建一个，然后在其中加入配置 module.exports = { devServer: { disableHostCheck: true } } 再访问项目外网网址，发现问题已经解决。 ...
vue 项目穿透 invalid host header disablehostcheck: true无效
08-09
当我们在Vue项目中遇到"Invalid host header"错误时，可以尝试使用"disableHostCheck: true"来解决。 通常情况下，这个错误是由于webpack-dev-server的host配置引起的。默认情况下，webpack-dev-server会检查请求的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

MW0309

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值