经过nginx部署前端代码实现先后端分离

实现先后端分离，可让先后端独立开发、独立部署、独立单测，双方经过JSON进行数据交互。

对于前端开发人员来讲，不用每次调试都须要启动或配置Java/Tomcat运行环境；对于后端开发人员来讲 ，也不用在须要往JSP页面注入数据。

 

经过nginx来部署前端代码，能够帮助前端实现如下基本需求：

一、请求转发，解决请求跨域的问题

 

server {

        listen       7777;

         location /{

            root   /Users/xiaoyun/git/someproject/dist;

        }

        location /api/v1{

               proxy_set_header Host api.yourhost.com;

                proxy_pass http://api.yourhost.com/api/v1/;

        }

        location /api/v2{

                proxy_pass  http://api.yourhost.com/new;

        } 

    }

以上是一段nginx配置参考：

listen    nginx服务端口号

location  /    设置默认根目录所访问的本地代码路径，这里还能够设置默认主页index

proxy_pass   请求转发，能够配置多个，从上至下进行匹配

以第一个配置为例，即全部本地以/api/v1开头的请求都会转发至对应线上服务器，

例如  http://localhost:7777/api/v1/getConfig 则会自动转发自 http://api.yourhost.com/api/v1/getConfig

另外，还须要注意的是，proxy_pass配置的路径若是是以/结尾，如上面的配置v1，那么此时路径为相对路径，不然为绝对路径

例如 v2的转发配置：

若是请求 http://localhost:7777/api/v1/user/list   则会转发自 http://api.yourhost.com/new/user/list ，不会带有原路径的 /api/v2

 

 

二、gzip请求压缩

网站开启gzip压缩，不只可以节省带宽，也可以快速响应用户的访问

 

 

---

 

http{

gzip  on;

gzip_proxied any;

gzip_min_length  1024;

gzip_buffers     4 8k;

gzip_comp_level 3;

gzip_types       text/plain text/css application/x-javascript application/javascript application/xml application/json;

} 

---

如下为各项配置做用：

gzip on;      （启用 gzip 压缩功能）

    gzip_proxied any;  （nginx 作前端代理时启用该选项，表示不管后端服务器的headers头返回什么信息，都无条件启用压缩）

    gzip_min_length  1024; （最小压缩的页面，若是页面过于小，可能会越压越大，这里规定大于1K的页面才启用压缩）

    gzip_buffers     4 8k; （设置系统获取几个单位的缓存用于存储gzip的压缩结果数据流）

    gzip_comp_level 3; （压缩级别，1压缩比最小处理速度最快，9压缩比最大但处理最慢，同时也最消耗CPU,通常设置为3就能够了）

    gzip_types       text/plain text/css application/x-javascript application/javascript application/xml application/json; （什么类型的页面或文档启用压缩）