最近花了一點時間學習React框架，然後自己照着教程寫了下前端頁面。
再學完之後，需要對前端代碼進行打包操作：執行 npm run build 。
打包項目需要花一點時間，等待兩分鐘。
在打包好之後會出現這樣的提示：
The build folder is ready to be deployed.
You may serve it with a static server:
serve -s build
提示我們可以 接着 執行 serve -s build 或者 serve build 來作爲一個本地靜態serve提供服務。然後就會出現如下：
┌────────────────────────────────────────────────────┐
│ │
│ Serving! │
│ │
│ - Local: http://localhost:53075 │
│ - On Your Network: http://192.168.x.xx:53075 │
│ │
│ This port was picked because 5000 is in use. │
│ │
│ Copied local address to clipboard! │
│ │
└────────────────────────────────────────────────────┘
有了一個本地的地址和網絡地址 端口port是一樣的 (這裏我的後端服務是掛在5000端口上
在完成上述操作之後，在瀏覽器地址欄中輸入 ‘http://localhost:53075’ 然後登錄會發現其實存在一個跨域問題，這也引出了本次內容的問題所在。
因爲我的前後端是分別啓用的，前端是在53075端口，但是我的後端服務是在5000端口，所以存在一個跨域的問題。那麼要如何解決這個問題呢？
----------------------------------------------------------
這裏，我們使用nginx來幫助我們解決跨域問題，非常簡單！
第一步： 安裝nginx
brew install Nginx
第二步：輸入 nginx 如果能看到以下的畫面說明安裝啓動成功。
第三步： 核心關鍵一步我們需要修改nginx 的配置文件 nginx.conf
location / {} 中添加了 一句 proxy_pass +前端地址
然後新增加一段 location ~/api/ {} 添加一句 proxy_pass + 發送給後端的api請求
這裏我們可以看出，nginx起到了一個反向代理的作用。自身端口是8080，會根據不同 判斷出是應該返回給前端的js代碼還是 一個api請求給後臺返回得到數據。相當於起到了一箇中間媒介的作用，這樣我們就不用擔心前後端跨域問題了。
此時，輸入http://localhost:8080/ 會跳轉到登錄界面，輸入賬號密碼 api正常請求 成功登錄號。