部署項目遇到的問題匯總

問題一：nginx部署完成后，訪問后端的接口返回CORS跨域請求

思考：我部署的前后端都在同一個宿主機上，訪問的ip都是相同的，不應出現跨域才對。

解決：當你的nginx有如下配置（該配置通常用于本地開發環境）

server {
    listen       80;
    server_name  xxx.aliyun.com;
    location / {
        root   html;
        index  index.html index.htm;
        proxy_pass   http://127.0.0.1:8080;
     }
}

線上環境下：
你會發現spring boot tomcat server接受到的post請求url的host信息是http://127.0.0.1，但是請求的origin信息是http://xxx.aliyun.com。 此兩者不一致，spring boot tomcat server返回403狀態碼和Invalid CORS request內容。

修復方法1：
nginx里添加配置：proxy_set_header Host $host;

server {
    listen       80;
    server_name  xxx.xxx.xxx.xxx;
    location / {
        root   html;
        index  index.html index.htm;
        proxy_set_header  Host $host;
        proxy_pass  xxx.xxx.xxx.xxx:6666;
     }
}

這時spring boot tomcat server接受到的post請求url的host信息就不是127.0.0.1了

解決來源：
鏈接：https://www.jianshu.com/p/99b2534c7737
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。

問題二：nginx同時部署兩個前端項目

需求：項目中有前臺的前端和后臺管理端的前端兩個項目，都需要部署在同一個nginx中，并使用不同的二級域名訪問如

front.xxx.com
admin.xxx.com

解決：

①在nginx目錄下的ntml目錄下建兩個文件夾，分別存放兩個項目的打包后的文件

②在nginx配置文件中配置兩個server，可以使用相同的端口，但是server_name一定要區分開

#user  root;
worker_processes  1;
events {
  worker_connections  1024;
}
http {
  include       mime.types;
  default_type  application/octet-stream;
  sendfile        on;
  keepalive_timeout  65;
  server {
      listen       80;
      charset      utf-8;
      server_name  front.xxx.com; #前臺項目
      location / {
          root   /usr/share/nginx/html/dist;#注意當前項目的地址
          try_files $uri $uri/ /dist/index.html;#注意當前項目的地址
          index  index.html index.htm;
          error_page 405 =200  $request_uri;
      }
      location /api {
          proxy_pass http://112.xxx.xx.35:6666;
          proxy_set_header  Host $host;
          proxy_redirect default;
	  	rewrite ^/api/(.*) /$1 break;
      }
  }
  server {
      listen       80;
      charset      utf-8;
      server_name  admin.xxx.com; #后臺管理系統
      location / {
          root   /usr/share/nginx/html/static;#注意當前項目的地址
          try_files $uri $uri/ /static/index.html;#注意當前項目的地址
          index  index.html index.htm;
          error_page 405 =200  $request_uri;

          proxy_pass http://112.xxx.xx.35:6666;
          proxy_set_header  Host $host;
          proxy_redirect default;
	  	rewrite ^/api/(.*) /$1 break;
      }
      error_page   500 502 503 504  /50x.html;
      location = /50x.html {
          root   html;
      }
  }
}

問題三：nginx訪問ftp服務器下的靜態文件

需求：使用FTP文件服務器作為靜態頁面的存放位置，但是nginx要怎么才能訪問到里面的靜態html文件呢？

解決：

①docker-compose.yml文件中的nginx掛載

這里的/home/ftp/root是ftp文件服務器在宿主機中的根目錄

這里的/var/local是nginx服務的虛擬容器中的存放靜態頁面的地址

②nginx配置文件中配置/ftp路徑的映射地址

location /ftp/ {
      	alias /var/local/root/webpages/;#ftp服務器中的文件映射nginx中的位置【前提是要在nginx的掛載那里要掛載該目錄】   
      	autoindex on;
}

③修改項目中訪問靜態頁面的地址：ip+路徑映射+文件的相對根目錄的路徑

export const STATIC_PAGE_BASE_URL = "http://112.124.55.35/ftp/staticPages/"

路徑拼接邏輯：

大功告成？？

no！雖然不是404了，但是變成了403！這是因為權限不夠，需要在nginx.cnf文件頂部加一行

完成！