搜尋
首頁運維Nginx如何利用Nginx反向代理解決跨域問題

問題

在先前的分享的跨域資源共享的文章中,有提到要注意跨域時,如果要發送cookie,access-control- allow-origin就不能設為*,必須指定明確的、與請求網頁一致的網域名稱。在此次專案開發中與他人協作中就遇到此類問題。

如何利用Nginx反向代理解決跨域問題

解決想法

  1. #一般來說,與後台利用cors跨域資源共享將access- control-allow-origin設定為訪問的網域即可,這個需要後台的配合,而且有些瀏覽器是不支援的。

  2. 基於與合作方後台的配合,利用nginx方向代理來滿足瀏覽器的同源策略來實現跨域

# #實作方法

反向代理程式概念

#反向代理程式(reverse proxy)方式是指以代理伺服器來接受internet上的連線請求,然後將請求轉送給內部網路上的伺服器;並將從伺服器上得到的結果傳回給internet上請求連線的客戶端,此時代理伺服器對外就表現為一個伺服器。反向代理伺服器對於客戶端而言它就像是原始伺服器,並且客戶端不需要進行任何特別的設定。客戶端向反向代理的命名空間(name-space)中的內容發送普通請求,接著反向代理將判斷向何處(原始伺服器)轉交請求,並將獲得的內容傳回給客戶端,就像這些內容原本就是它自己的一樣。

利用nginx反向代理實現跨域的步驟

#去下載套件建立nginx環境


如何利用Nginx反向代理解決跨域問題

修改nginx的設定文件,找到ngixn.conf文件,修改相關配置


http {
 include  mime.types;
 default_type application/octet-stream;

 sendfile  on;

 server {
  listen  8000; #监听8000端口,可以改成其他端口
  server_name localhost; # 当前服务的域名

  location /wili/api/ {
    proxy_pass http://chick.platform.deva.wili.us/api/; #添加访问路径录为/will/api的代理配置
    proxy_http_version 1.1;
  }
  
  location / {
    proxy_pass http://localhost:8001;
    proxy_http_version 1.1;
  }
  
  error_page 500 502 503 504 /50x.html;
  location = /50x.html {
   root html;
  }

 }

}

配置的解釋:

    ##由設定資訊可知,我們讓nginx監聽localhost的8000端口,網站a與網站b的訪問都是經過localhost的8000端口進行訪問。
  • 我們特殊配置了一個"/will/api"的訪問,使以"will/api」開頭的位址都轉到""進行處理。
  • 存取位址修改
  • 既然我們已經設定了nginx,那麼所有的存取都要走nginx,而不是走網站原本的位址(a網站localhost:8001,b網站)。所以要修改a網站中的請求介面換成。接下來啟動nginx,存取配置的8000即可


如何利用Nginx反向代理解決跨域問題
#需要注意的一點是nginx啟動可能會衝突連接埠造成啟動不成功,可在任務管理器查看是否啟動成功。

以上是如何利用Nginx反向代理解決跨域問題的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文轉載於:亿速云。如有侵權,請聯絡admin@php.cn刪除
NGINX與Apache:性能,可伸縮性和效率NGINX與Apache:性能,可伸縮性和效率Apr 19, 2025 am 12:05 AM

NGINX和Apache都是強大的Web服務器,各自在性能、可擴展性和效率上有獨特的優勢和不足。 1)NGINX在處理靜態內容和反向代理時表現出色,適合高並發場景。 2)Apache在處理動態內容時表現更好,適合需要豐富模塊支持的項目。選擇服務器應根據項目需求和場景來決定。

終極攤牌:nginx vs. apache終極攤牌:nginx vs. apacheApr 18, 2025 am 12:02 AM

NGINX適合處理高並發請求,Apache適合需要復雜配置和功能擴展的場景。 1.NGINX採用事件驅動、非阻塞架構,適用於高並發環境。 2.Apache採用進程或線程模型,提供豐富的模塊生態系統,適合複雜配置需求。

nginx行動:示例和現實應用程序nginx行動:示例和現實應用程序Apr 17, 2025 am 12:18 AM

NGINX可用於提升網站性能、安全性和可擴展性。 1)作為反向代理和負載均衡器,NGINX可優化後端服務和分擔流量。 2)通過事件驅動和異步架構,NGINX高效處理高並發連接。 3)配置文件允許靈活定義規則,如靜態文件服務和負載均衡。 4)優化建議包括啟用Gzip壓縮、使用緩存和調整worker進程。

NGINX單元:支持不同的編程語言NGINX單元:支持不同的編程語言Apr 16, 2025 am 12:15 AM

NGINXUnit支持多種編程語言,通過模塊化設計實現。 1.加載語言模塊:根據配置文件加載相應模塊。 2.應用啟動:調用語言運行時執行應用代碼。 3.請求處理:將請求轉發給應用實例。 4.響應返回:將處理後的響應返回給客戶端。

在Nginx和Apache之間進行選擇:適合您的需求在Nginx和Apache之間進行選擇:適合您的需求Apr 15, 2025 am 12:04 AM

NGINX和Apache各有優劣,適合不同場景。 1.NGINX適合高並發和低資源消耗場景。 2.Apache適合需要復雜配置和豐富模塊的場景。通過比較它們的核心特性、性能差異和最佳實踐,可以幫助你選擇最適合需求的服務器軟件。

nginx怎麼啟動nginx怎麼啟動Apr 14, 2025 pm 01:06 PM

問題:如何啟動 Nginx?答案:安裝 Nginx啟動 Nginx驗證 Nginx 是否已啟動探索其他啟動選項自動啟動 Nginx

怎麼查看nginx是否啟動怎麼查看nginx是否啟動Apr 14, 2025 pm 01:03 PM

確認 Nginx 是否啟動的方法:1. 使用命令行:systemctl status nginx(Linux/Unix)、netstat -ano | findstr 80(Windows);2. 檢查端口 80 是否開放;3. 查看系統日誌中 Nginx 啟動消息;4. 使用第三方工具,如 Nagios、Zabbix、Icinga。

nginx怎麼關閉nginx怎麼關閉Apr 14, 2025 pm 01:00 PM

要關閉 Nginx 服務,請按以下步驟操作:確定安裝類型:Red Hat/CentOS(systemctl status nginx)或 Debian/Ubuntu(service nginx status)停止服務:Red Hat/CentOS(systemctl stop nginx)或 Debian/Ubuntu(service nginx stop)禁用自動啟動(可選):Red Hat/CentOS(systemctl disable nginx)或 Debian/Ubuntu(syst

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SecLists

SecLists

SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合,這些清單在安全評估過程中經常使用,而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表,幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上,他就可以存取所需的每種類型的清單。

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )專業的PHP整合開發工具

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境