Docker部署前端項目，Nginx反向代理后跨域失效是什么原因？

docker環境下nginx反向代理導致前端跨域失效的排查與解決

在Docker容器中部署前端項目并使用Nginx進行反向代理時，經常會遇到跨域問題。本文分析一個實際案例，幫助您理解并解決此類問題。

案例中，開發者使用Nginx將前端請求代理到后端服務（3344端口），但前端請求仍然出現跨域錯誤。 仔細檢查Nginx的default.config文件后發現，反向代理配置本身沒有問題，能夠成功將請求轉發到3344端口。

然而，問題的根源在于前端代碼。前端代碼在發起請求時，仍然直接使用了3344端口，而不是通過Nginx代理的域名或IP地址。 雖然Nginx已正確地將請求轉發到后端，但前端繞過了代理，導致瀏覽器認為請求的來源與后端服務不一致，從而引發跨域錯誤。

立即學習“前端免費學習筆記（深入）”；

解決方案：修改前端代碼

解決方法并非修改Nginx配置，而是調整前端代碼中的API請求地址。 前端代碼應直接使用后端服務的域名或IP地址進行請求，去除不必要的端口號（3344）。 Nginx反向代理會自動處理請求的轉發，從而避免跨域問題。 通過此調整，前端請求將正確地通過Nginx代理，解決跨域錯誤。