来源: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的基础类型(int,bool,str):

    Python的基础类型(int,bool,str): 1.int -------> 整形:主要用力进行数字计算 2.string ------>字符串:可以保存少量数据并进行相关的操作 3 ...

  2. Vue-router路由的简单使用

    一.安装路由: 如果使用vue-cli脚手架搭建,项目创建过程中会提示你自否选择使用vue-router,选择使用即可, 二.创建组件 1.vue-cli项目自动创建的路由文件是src包下面的rout ...

  3. 浏览器HTML自带懒加载技术

    对于目前的图片懒加载,我们一般采用的是通过第三方库或懒加载库来实现,但是该方式的显著问题就是,必须按顺序执行: 1.加载初始的 HTML 响应内容 2.加载懒加载库 3.加载图片 假如浏览器能直接支持 ...

  4. Adapter的实现

    Adapter概念: Adapter是连接后端数据和前端显示的适配接口,是数据和UI(View)之间一个重要的纽带.在常见的View(ListView, GridView)等地方都需要用到Adapte ...

  5. Bootstrap 网页2

    html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <me ...

  6. MySQL-几种关联

    左表t1: DROP TABLE IF EXISTS t1; )); ,'t1a'); ,'t1b'); ,'t1c'); ,'t1d'); ,'t1f'); 右表 t2: DROP TABLE IF ...

  7. openwrt增加密码及ssh的方法

    openwrt增加密码及ssh的方法 1.进入openwrt系统源码的顶层目录,然后执行 make menuconfig命令进入 Network--> SSH-->  <*>o ...

  8. 学习java web中的listener

    web.xml里的顺序为:context-param->listener->filter->servlet 监听器是需要新建一个类,然后按监听的对象继承:ServletContext ...

  9. 对于页面上下载pdf或者excel按钮的实现

    这个主要是通过      window.open(url + params) url后台给存放的路径,params是参数

  10. 集训队8月2日(BFS)

    看书情况:109~124页 刷题数:6 今天把上两次比赛的该补的题都补了,补题有博客,还写了两道书上例题的博客. 书上例题 BFS思维https://www.cnblogs.com/246247839 ...