来源:https://blog.csdn.net/Cookysurongbin/article/details/86077241

vue-cli搭建的环境,用nginx做代理服务器,访问时显示:Invalid Host header

经查是因为新版的webpack-dev-server出于安全考虑,默认检查hostname,如果hostname不是配置内的就不能访问。这样有2中方法,一种是设置跳过host检查,一种是直接host设置成你的地址。

1、关闭host检查

可以在build目录下的webpack.dev.conf.js文件,devServer下添加disableHostCheck: true,跳过检查

同样的原理,可以在package.json文件修改scripts命令:webpack-dev-server --disableHostCheck=true

2、设置成你的host,加入你的host是xxx.com,同样2中方法,修改配置文件,和script命令

在config目录下修改index.js文件的host,这个默认是localhost,可修改成   xxx.com
package.json的script语句: webpack-dev-server --host=xxx.com或者--public=xxx.com

【转载】vue-cli搭建的环境,用nginx做代理服务器,访问时显示:Invalid Host header的更多相关文章

  1. 【记录】解决uni-app 用nginx反向代理出现Invalid Host header问题

    之前解决过一次,后来给忘记了,今天又遇到这个问题,现记录一下 修改uni-app的manifest.json文件  - >源码视图 添加以下代码: "disableHostCheck& ...

  2. natapp 穿透访问 vue项目 Invalid Host header

    由于要近期开发微信小程序,所以今天了解了一下这个netapp 内网映射这个东西,所以一开始自己就在网上看,然后想把环境部署起来,参考https://natapp.cn/ ,看了一分钟教程以后,然后自己 ...

  3. 搭建windows环境下(nginx+mysql+php)开发环境

    搭建windows环境下(nginx+mysql+php)开发环境   1. 所需准备应用程序包        1.1 nginx 程序包nginx-1.0.4.zip或其他版本(下载地址: http ...

  4. @Vue/Cli 3 Invalid Host header 检测关闭

    Invalid Host header 在本地开发等一般情况下,无论是 local,还是 ip,或者是 0.0.0.0,在 cli 中都默认为合法的,但是有些场景可能会被不支持,比如远程开发,或者是云 ...

  5. Nginx 代理Vue项目出现Invalid Host header

    说明 使用 Nginx 的 upstream 对 Vue 项目做负载均衡时,代理的地址无法访问目标地址,且页面报错: Invalid Host header(无效主机头) 分析 检查 Nginx 的 ...

  6. 开发环境绑定host vue 返回 invalid host header

    事情:使用域名绑定host为本机电脑ip,vue返回 invalid host header 原因:新版的webpack-dev-server出于安全考虑,默认检查hostname,如果hostnam ...

  7. 解决 Vue 项目 invalid host header 问题(两种方案)

    问题出现背景 做微信H5网页时,使用花生壳内网穿透进行调试时,打开网页显示:invalid host header 分析问题 这句话的意思是:无效的Host请求头: 因为在vue在调试时相当于启动了一 ...

  8. 【Nginx】使用Nginx做反向代理时,关于被代理服务器相应的超时设置

    > 参考的优秀文章 Module ngx_http_proxy_module > 设置等待被代理服务器的最大响应时间 使用Nginx做反向代理时,因被代理服务器因业务确实复杂,需时较久,往 ...

  9. 用nginx做代理服务器上网

    用nginx做代理服务器上网 目前现状:只有1个机器能上网(web),其他机器不能方法:能上网的做一个代理web服务器中转,其他机器连接它即可.采用nginx Nginx配置如下: server{   ...

随机推荐

  1. 【学习总结】Python-3-逻辑运算符

    参考:菜鸟教程-Python3运算符 逻辑运算符的计算规则划重点: 并不是只返回布尔型,有时会返回变量的数值 (优先级:not>and>or) 总结: '与或非'三件套中,not与数学逻辑 ...

  2. Dagger2 探索记2——四大基本组件(二)

    书接上文,先回顾以下前一章写的内容. 内容大概就是在Activity中用@Inject标记一个注入的类,然后在这个类的构造函数上也打个@Inject标记,然后使用@Component来连接两边,完成对 ...

  3. docker学习---搭建Docker私有库及删除库内镜像

    环境准备系统: cat /etc/redhat-release CentOS Linux release (Core) 主机两台,分别是docker私有库服务器(IP 192.168.121.121) ...

  4. Vue路由组件vue-router

    一.路由介绍 Creating a Single-page Application with Vue + Vue Router is dead simple. With Vue.js, we are ...

  5. python函数参数*args **kwargs

    毕业多年,把C++都就饭吃了....今天居然在纠结什么是形参什么是实参..... 定义函数里面写的参数就是形参,因为没有内存占用,实际调用时写的参数就是实参,因为有内存占用和传值 然后就是位置参数,可 ...

  6. vue中引入路由,如果你懒得写那么

    可以npm i vue-router --save,项目中自动给你写好,vuex也可以

  7. ! Unknown property attribute "class"

    当时是在用Xcode 7进行编译ASDK的代码发现报错了 当时就蒙圈了,@property(class)--这是啥呀,太久没看过object-c了,但是不至于@property是没有class属性的, ...

  8. iOS 获取self类型

    类型转换快速写法 typeof(self) bself = self; 版权声明:本文为博主原创文章,未经博主允许不得转载.

  9. PIL库,图像处理第三方库

    PIL  ---> python imaging library 安装需要安装pillow库,包含了21种类,其中Image类是PIL最重要的一个类,可以通过它来处理图像. Python最常用的 ...

  10. linux kafka进程挂了 自动重启

    使用crontab,定时监控 kafka进程,发现挂了后重启. shell脚本如下: #!/bin/sh source /etc/profile proc_dir="/data/kafka& ...