之前项目没有前后端分离的时候，部署贼简单，直接启动一个应用就可以了。但是如果拆分成前后端分离的项目，那么部署方式可能就变了，毕竟已经有两个项目了，那具体怎么部署呢？毕竟两个项目有可能会有跨域的问题。

部署方案1、单项目部署模式

假设我们前端是vue或者html项目，后端是springboot项目，那么部署的时候直接把前端打包后的静态资源放在springboot项目下的static文件夹下面，当作是静态资源。然后部署的时候就跟不分离模式一样了，只需要启动一个springboot即可。也没有跨域问题。

部署方式2、Nginx+springboot

我们可以把前端项目打包后放在Nginx的资源目录下面，然后配置文件按路径做个代理到springboot来解决跨域问题，配置文件如下.

upstream myServer {
       server 100.201.22.93:9991;
   }
  server {
     listen 8010;
location / {
                     root /home/nginx/web;
                     try_files $uri $uri/ /index.html;
                     index index.html index.htm;
                  }
location ~* /api/(.*)
{
                      set $path $1;
                      proxy_pass              http://myServer;
                      proxy_set_header        Host $host:$server_port;
                      proxy_set_header        X-Real-IP $remote_addr;
                      proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
                  }
  }

部署方式3、Nginx+springboot+docker

假设我们的前端不是直接用Nginx，而是另起一个项目，比如用docker或者另一个nginx，那么为了防止跨域问题，我们要做两个代理，如下配置

    upstream qd  {
        #hash $remote_addr consistent;
        server 100.33.22.93:9096  max_fails=2 fail_timeout=180s ;
        check interval=5000 rise=2 fall=5 timeout=3000 type=http;
        check_http_send "GET / HTTP/1.0\r\n\r\n";
        check_http_expect_alive http_2xx http_3xx http_4xx;
    }

    upstream ht {
        #hash $remote_addr consistent;
        server 100.33.22.93:9092  max_fails=2 fail_timeout=180s ;
        check interval=5000 rise=2 fall=5 timeout=3000 type=http;
        check_http_send "GET / HTTP/1.0\r\n\r\n";
        check_http_expect_alive http_2xx http_3xx http_4xx;
    }


    server {
        listen 9092;
        underscores_in_headers on;
        access_log  logs/700-ydkf.access.log;
        error_log  logs/700-ydkf.errot.log;


         location / {
                proxy_connect_timeout 2s;
                proxy_send_timeout    30m;
                proxy_read_timeout    30m;
                proxy_pass http://qd;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-Proto $scheme;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
                proxy_set_header Host $host:$server_port;
        }

        location  /api/{
                proxy_send_timeout    30m;
                proxy_read_timeout    30m;
                proxy_pass http://ht;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-Proto $scheme;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
                proxy_set_header Host $host:$server_port;
        }

}

注意proxy_pass后面的地址最后加不加/要看你的项目具体部署调用的时候需不需要去掉/api，若不需要则加上，需要则不用加。

感想

都是为了解决跨域问题啊！