工作过程中遇见一个问题,使用Vue-cli 搭建了一个工程,由于跨域的问题 使用了自带的dev-server Express Server(A后台) http-proxy-middleware 去访问后台的接口nginx Server(B后台),而这个接口为niginx 代理的另一个后台(C后台),理清一下关系:

  开发页面去请求A后台(devServer)的接口, 然后这个请求会被转发的B后台(nginx), 然后再会被nginx映射到C后台(我们真实要访问的后台),你可能会问为什么不用A直接去代理访问C, 非要在中间加了个nginx呢 ? 由于C是个交换机设备上的server, 直接用我的A (devServer)去代理C不好使,所以才有这样的情景。

  从B到C的过程一切都很正常,但是从A到B中间的每次的请求返回时connection 都是close , 而正常的是keep-alive的,这就导致我在页面里登录成功后 继续请求其他接口还是验证不通过。网上找了好多资料都不好使。

  最终解决方案是,(当一条路走不通的时候,换一条试试):

  跨域问题解决的方法之一, CORS

  通过修改ngnix配置文件,加入allow-origin头

        location ~ \.do$ {
add_header 'Access-Control-Allow-Origin' 'http://localhost:8080'; //这个是我的A devServer,必须设置具体的值,不要使用* 否则访问接口的时候浏览器会报错
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
add_header 'Access-Control-Allow-Credentials' true;
add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
proxy_pass http://172.16.15.65;
}

  配置完这个重启nginx然后你的页面里直接写B的接口就不会存在跨域问题了,但是这个时候如果登录的过程中产生了一个cookie这个信息在你后面访问借口的时候不会自动添加上的,需要在你的ajax里面加上withCredentials,例如jquery 的ajax

     $.ajax({
url : "*****",
type : post,
dataType : params.dataType,
data : cliPostData,
cache : false,
//注意这里
xhrFields: {
withCredentials: true
},
success : function(data) {
}
      })

  这样就可以携带cookie的认证信息了,然后再进行页面的直接访问接口就可以正常使用了。

记一个http-proxy-middleware 代理访问nginx映射的接口不通过的问题(connection close)的更多相关文章

  1. 记一个关于std::unordered_map并发访问的BUG

    前言 刷题刷得头疼,水篇blog.这个BUG是我大约一个月前,在做15445实现lock_manager的时候遇到的一个很恶劣但很愚蠢的BUG,排查 + 摸鱼大概花了我三天的时间,根本原因是我在使用s ...

  2. 通过代理访问nginx和直接访问nginx区别

    80.82.78.38 [23/Sep/2016:05:36:18 +0800] "GET http://www.baidu.com/cache/global/img/gs.gif HTTP ...

  3. 正向代理与反向代理以及Nginx【总结】(转)

    今天在了解Nginx的时候,涉及到反向代理的问题,看到一篇博文写的清晰明了,转载记录一下,后续继续学习,再次感谢博主的分享. 原文地址:https://www.cnblogs.com/Anker/p/ ...

  4. Nginx 防CC攻击拒绝代理访问

    先大概说说简单的结构…前端一个Nginx反向代理,后端一个Nginx instance app for PHP…实际上就是个Discuz,之前面对CC攻击都是预警脚本或者走CDN,但是这次攻击者不再打 ...

  5. Linux(7)- Nginx.conf主配置文件、Nginx虚拟主机/访问日志/限制访问IP/错误页面优化、Nginx反向代理、Nginx负载均衡

    一.Nginx.conf主配置文件 Nginx主配置文件conf/nginx.conf是一个纯文本类型的文件,整个配置文件是以区块的形式组织的.一般,每个区块以一对大括号{}来表示开始与结束. 核心模 ...

  6. Nginx反向代理访问内网服务器

    Nginx反向代理访问内网服务器 问题描述 ​ 公司给配的台式机太垃圾了,不能访问外部网络就算了,还没有maven私服.近期项目不光得使用maven还得使用内网中的数据库之类,台式机太卡只能用自己的笔 ...

  7. Docker Nginx-Proxy 容器Nginx Proxy反向代理

    Docker Nginx-Proxy 容器Nginx Proxy反向代理   简单介绍 Docker容器的自动Nginx反向代理   dockerhub地址 https://hub.docker.co ...

  8. CentOS6.3搭建Nginx代理访问MongoDB GridFS图片资源

    PHP可以直接读取MongoDB GridFS中的图片并显示到页面中,但对PHP的压力就大了.偶然机会,了解到Nginx可以代理访问,实现过程如下: 1.工具准备 安装一些必要的编译工具及库,这里是直 ...

  9. requests使用“proxy”代理访问接口

    在requests中使用proxy代理访问 使用前先更新requests版本为支持socks的版本.   先pip安装对应库:  >> pip install -U requests[so ...

随机推荐

  1. Android查缺补漏--BroadcastReceiver的类型与使用

    Broadcast 是一种被用于应用内和应用之间传递信息的机制.一个广播可以对应多个接受者.一个完整的广播机制,需要具有以下三个要素: 发送广播的Broadcast 接受广播的BroadcastRec ...

  2. Druid数据库连接池源码分析

    上一篇文章重点介绍了一下Java的Future模式,最后意淫了一个数据库连接池的场景.本想通过Future模式来防止,当多个线程同时获取数据库连接时各自都生成一个,造成资源浪费.但是忽略了一个根本的功 ...

  3. gulp提高微信小程序开发效率

      最近公司要求把一套公众号项目的页面迁移到小程序,也就意味着要重新敲一份代码,不能更繁琐了,为了节省时间,提高迁移效率,就决定自己动手用gulp搭一个简易的小程序框架,再记录一下搭建过程.希望有大神 ...

  4. 大数据学习(7)Hadoop高可用

    HDFS高可用 通过主从切换实现单NameNode高可用.通过Federation:水平扩展来联合多NameNode个: NameNode高可用 把edits日志从原来的nameNode中分离出来,存 ...

  5. java中可变长参数

    ** * Created by Lenovo on 2017/12/10. * java中可变长参数 */ public class reflect04 { //m1有一个int类型的可比变长参数 / ...

  6. ArcGIS API for Javascript 加载天地图(经纬度投影)

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

  7. mysql也有complex view merging 这个特性(5.6 , 5.7)

    出处:黑洞中的奇点 的博客 http://www.cnblogs.com/kelvin19840813/ 您的支持是对博主最大的鼓励,感谢您的认真阅读.本文版权归作者所有,欢迎转载,但请保留该声明. ...

  8. Ubuntu下LAMP环境配置

    接下来是搭建个人学习环境,之前的随笔介绍了个人的网络配置,简单记录一下. 1. 安装apache: apt-get install apache2 2.  安装php5:apt-get install ...

  9. Python学习_07_错误、异常

    地毯式地过语法终于快要结束了... Python中的常见异常 1.NameError:尝试访问一个未初始化的变量 2. ZeroDivisionError:除数为0 3. SyntaxError:Py ...

  10. Java Web高级编程(一)

    Servlet 一.创建Servlet类 在Java EE中,Servlet用来接收和响应终端用户的请求.Servlet是所有Web应用程序的核心类,是唯一既可以直接处理和响应用户请求,也可以将处理工 ...