20170731

问题描述

• 1.项目中需要使用nginx作为反向代理服务器，代理一些静态文件（比如：使用webpack打包好的html页面，和图片等等）以及BFF层的服务。
• 2.因此项目中想通过映射的方式，将nginx的配置文件以及静态资源映射进容器。
• 3.但是却出现前端发的请求BFF无论如都接受不到

解决过程

• Q1:首先我考虑到的必然是路径写错了
• A1:去检查前端发送的请求路径，前端路径的写法http://node_service:3000/api由于BFF服务启动在node_service容器中因此，我认为这个路径没有问题。然后检查ngixn的配置

server {
    sendfile off;
    listen       80;
    charset utf-8,gbk;

    location /api {
        proxy_pass http://node_service:3000;
        rewrite /api/(.+)$ /$1 break;
    }

但是由于我对ngixn不太熟悉，配置也不太能看懂，大概猜测，匹配/api请求的都交给location去做proxy_pass转发请求，然后改写路由。看着配置中转发的路由也没什么问题。然而只能在chrom的network中看到我的http://node_service:3000/api/user一直404。

---

• Q2：那么是不是ngixn的配置有问题？造成proxy_pass没有转发请求？那么就有两个点，首先location是否接受请求？然后如果接受了，那么为什么不转发？
• A2:但是由于ngixn的反向代理，我只能在chrom上看到前端的请求路径http://node_service:3000/api/user却没有办法看到请求是否被转发以及转发到哪里了，因此我不论我如何修改proxy_pass后的值，都没有办法受到资源。

---

• Q3:为了验证配置是否正确，需要查找了ngixn语法
• A3：首先proxy_pass是用来做反向代理转发进入location的请求的其次rewite用来改写url，
  rewirte <匹配规则> <改写规则> 第一个参数是正则表达式，用来匹配url中的值，改写uri。然而rewrite会在改写之后吧url扔出去重新让他匹配location，因此break设置之后就不会重新匹配了。看来语法都没有什么问题。
  这里最难以解决的问题是我不断改变代理的路径但是chrome只能看到从前端发来的请求路径，根本无法判断之后又被转发的哪里了。

---

• Q4:那么是否能说明请求没有进入过这个location？没有办法检测现在只能对照一下原来work的代码
• A4:发现前端的请求路径是个相对路径而不是我写的带有域名端口号的绝对路径，我改写成为相对路径成功

---

• Q5:那么说明请求确实没有进入这个location，那么这里的相对和绝对路径有什么区别呢？
• A5:改变了请求路径之后，发现chrom上的请求路径立刻变成了http://localhost:9998/api/user，在观察listen 80;说明你发的绝对路径请求ngixn并没有提供给他

反思

• 以前使用不论是superagent还是别的发请求的方式都是使用相对路径，我都没有怀疑和问为什么。现在想着其实就是可以自动向前缀中添加当前的服务路径