前后端项目使用Nginx同域部署

前后端分离的项目，无论是否部署在同一台机器，都应尽量使前后端项目暴露于同一个域下【协议+主机+端口】，方法就是在部署前端的Nginx上，使用同一个域来反向代理后端项目，好处多多：

1. 彻底、一劳永逸地解决跨域问题（开销也最低，因为不再有OPTIONS请求）。
2. 共享域名。
3. 利用反向代理隐藏后端地址。
4. 集中管理。

server {
    # 0.与浏览器交互的只有这个Nginx虚拟服务器，浏览器看到的【协议+主机+端口】永远只有一个，整个交互过程始终处于同一域下，故不会出现跨域问题
    listen 80;
    server_name localhost;
    
    # 1.前端项目打包好的dist目录，放置到这个目录下
    root /data/;
    
    # 2.后端多个微服务接口通过统一网关（9000）对外暴露，nginx反向代理统一网官 
    location ~* ^/(code|auth|admin|buy) { # 3.【code|auth|admin|buy】是后端各微服务接口前缀，网关按这个前缀来路由请求。
       proxy_pass http://127.0.0.1:9000;
       #proxy_set_header Host $http_host;
       proxy_connect_timeout 15s;
       proxy_send_timeout 15s;
       proxy_read_timeout 15s;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
} 

6. Docker部署可参考如下Dockerfile：

FROM nginx
COPY dist /data
RUN rm /etc/nginx/conf.d/default.conf
ADD my_nginx.conf /etc/nginx/conf.d/
RUN /bin/bash -c 'echo init ok'

特别注意后端服务的域名规划，比如【code、auth、admin、buy】等域名，要提前在后端接口上统一分配好。