使用反向代理解決跨域問題

以前拜讀過以前拜讀過nightire發表的一片名爲「先後分離架構的探索之路」的文章,也在提問中提到文章中不明白的內容,昨天有幸跟一位朋友聊起來如何使用反向代理解決跨域問題,通過他的指導我本身實踐,終於測試成功了,把結果分享一下。前端

問題場景:

後端開發API接口,部署在開發服務器上,前端開發靜態頁面部署在前端開發服務器上
前端JS中須要經過AJAX異步請求API的數據,因爲二者分佈在兩臺服務器中,因此這個請求存在了跨域nginx

解決方法:

方法一:
前端開發完成之後,將前端工程文件經過某些方法直接拷貝到後端服務器上,使二者處於同一臺服務器,解決跨域。
問題:
這樣作致使前端不能時時調試本身的邏輯,還要依賴於後端的環境segmentfault

方法二:
前端在本身的服務器上模擬後端API的數據
問題:
這樣作前端不只要寫本身的內容,還要額外編寫後端的測試數據,增長工做量並且不能直接知曉API的各類實際返回結果。後端

書歸正傳,下面說說如何使用反向代理解決跨域問題api

我用的是nginx,可使用其餘相同功能的軟件替換,好比我在本地開啓nginx監聽80端口,本地服務器跑8080端口,遠程API服務器在10.10.10.10上跨域

經過在nginx的配置文件,在location裏把常規路徑直接指向本地8080,把API請求路徑指向遠程服務器地址服務器

本地訪問localhost/常規地址,經過nginx的反向代理,請求會轉到localhost:8080這臺服務器上,代碼裏請求數據地址爲/api則會把請求轉到遠程PAI服務器上,而整個過程,咱們其實都是在localhost裏進行的,既沒有跨域名,也沒有跨端口。架構

使用反向代理的好處是,開發人員只須要關注本身的環境不須要關注與本身無關的內容,可以更加專一的開發和測試本身的代碼,缺點是要熟悉反向代理的環境搭建可能稍微有點超出本身的責任範疇。異步

各類方法都有優缺點,根據本身的實際狀況選擇合適本身的模式纔是王道。測試

注:本文在於拋磚引玉,內容裏某些概念或者文辭可能使用不當,僅表明我的理解,若有不當之處還望指出批閱。

相關文章
相關標籤/搜索