nginx解決跨域

聲明

摘自:https://juejin.cn/post/6844903942262882318#comment

跨域問題

跨域的定義

同源策略限制了從同一個源加載的文檔或腳本如何與來自另一個源的資源進行交互。這是一個用於隔離潛在惡意文件的重要安全機制。通常不允許不同源間的讀操作。

同源的定義

如果兩個頁面的協議，端口（如果有指定）和域名都相同，則兩個頁面具有相同的源。

 

nginx解決跨域的原理

例如：

• 前端server域名為：http://xx_domain
• 后端server域名為：https://github.com

現在http://xx_domain對https://github.com發起請求一定會出現跨域。

不過只需要啟動一個nginx服務器，將server_name設置為xx_domain,然后設置相應的location以攔截前端需要跨域的請求，最后將請求代理回github.com。如下面的配置：

## 配置反向代理的參數 server { listen 8080; server_name xx_domain ## 1. 用戶訪問 http://xx_domain，則反向代理到 https://github.com location / { proxy_pass https://github.com; proxy_redirect off; proxy_set_header Host $host; # 傳遞域名 proxy_set_header X-Real-IP $remote_addr; # 傳遞ip proxy_set_header X-Scheme $scheme; # 傳遞協議 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } } 復制代碼

這樣可以完美繞過瀏覽器的同源策略：github.com訪問nginx的github.com屬於同源訪問，而nginx對服務端轉發的請求不會觸發瀏覽器的同源策略。

作者：銳玩道
鏈接：https://juejin.cn/post/6844903942262882318
來源：掘金
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。