現在前、後端分離已經是web應用最常見的架構。但由於瀏覽器的同源策略導致web應用訪問不同域的資源不得不面臨跨域問題。如下圖所示：
簡單說下專案的現狀：
1、後台（服務端）採用紅帽的開源嵌入式web伺服器（undertow）部署；
2、前端，使用vuejs+element ui開發，通過nginx進行託管；
言歸正傳。
2、開啟nginx根目錄，config，找到nginx.cnf 檔案，新增以下配置：
2.1. 前端路由配置
server
}
server
proxy_pass
proxy_set_header host $host;
proxy_set_header x-real-ip $remote_addr;
proxy_set_header x-forwarded-for $proxy_add_x_forwarded_for;
proxy_set_header x-forwarded-proto $scheme;
proxy_connect_timeout 5;}}
（2）配置跨域的內容在後台路由配置裡面，也就是proxy_pass以上的內容。
（3）關於埠，8000是前台頁面的埠、8009是vue使用axios外掛程式配置的服務端api埠，8010是undertow給後台（服務端）指定的埠。
3、再次測試，已經能夠正常返回資料！
Nginx通過CORS配置實現跨域訪問
cors cross origin resource sharing 跨域資源共享 是指a頁面想獲得b頁面的資源，如果a b頁面的協議 網域名稱 埠 子網域名稱不同，所進行的的訪問都是進行跨域的，而瀏覽器為了安全考慮，對跨域訪問一般都是進行了限制的。需要注意的是，cors需要瀏覽器和伺服器同時支援。...
Nginx解決跨域問題 CORS
cors cross origin resource sharing 跨域資源共享,是一種允許當前域 domain 的資源 比如html js web service 被其他域 domain 的指令碼請求訪問的機制，通常由於同域安全策略 the same origin security policy...
Cors跨域之Spring Boot配置跨域
這裡貼一篇阮大神的文章，講的很好我就是看這篇文章學習的 跨域資源共享 cors 詳解 解決思路是，攔截跨域非簡單請求 不知道概念的看上面推薦的阮大神的額文章 的options預請求，並給正確的響應 這樣瀏覽器才會順利傳送真實的post請求。在專案中新增乙個 如下 component order or...