nginx nginx解決跨域詳解

2022-07-09 10:51:13 字數 1890 閱讀 3287

使用場景:本地執行乙個專案,但是要訪問外域的api介面,存在跨域問題,解決方式有很多,但我嘗試用nginx解決,搜尋了網上文章後再加上嘗試終於成功, 其中一些注意事項和大家分享一下。

一.window下使用nginx

重點:掌握重啟和關閉nginx的命令

1.安裝:

(不用雙擊nginx.exe)

配置檔案路徑: conf / nginx.conf

2.在命令列執行開啟、關閉、重啟命令:

開啟:start nginx

關閉:nginx.exe -s quit

重啟:nginx.exe -s reload  (修改配置檔案後需要重啟才生效)

啟動成功後,訪問 localhost:80可以看到這個介面 :

二. nginx.conf檔案配置

情況:我本地執行乙個專案,訪問位址是  http://localhost:8888 用的是8888埠,我配置nginx使用的是80埠,也就是http://localhost:80  就可以訪問到本地nginx伺服器,我希望 http://localhost:8888 可以訪問到    這個網域名稱下的介面,如果沒有通過nginx中轉的話,訪問時報跨域錯誤。那麼我是怎麼解決的呢,請一步一步來:

1. nginx.conf檔案配置:

說明:

(1)nginx的訪問埠可以修改為沒被占用的其他埠,這裡設定nginx的訪問路徑是  http://localhost:80

(2)注意這裡需要新增 proxy_pass 為本地執行的專案位址 http://localhost:8888 !!!當訪問 http://localhost:80 的時候,location會匹配 ' / ' 到資料夾根目錄下的index.html檔案,但這裡新增  proxy_pass 後,訪問 http://localhost:80  的時候會**到 http://localhost:8888,而且你的訪問路徑顯示的還是 http://localhost:80 ,內容是 http://localhost:8888的

(3)這裡location匹配的是 訪問  http://localhost:80/apis/.*   路徑的時候,在proxy_pass填上需要用到的外域api位址  /  ,此時就相當於訪問:

/ .*  ,但實際上顯示在你眼前的還是原來路徑: http://localhost:80/apis/.*   ,只是你訪問這個原路徑的時候nginx自動幫你**到你想要訪問的api路徑 。但這裡有個很重要的細節需要注意:匹配路徑  /apis/  和**路徑  /  後面的斜槓統統都不能少!!!任何乙個少了都不行,不信試試,這是nginx的規則。

修改完 nginx.conf 檔案後,需要重啟nginx ,才會生效 !!!

2.本地專案配置和訪問方式:

直接訪問 http://localhost:8888 不會通過 nginx中轉,而訪問 http://localhost:80 通過nginx中轉解決了跨域問題。

跨域php,php怎麼解決跨域

php解決跨域問題 在做專案的過程中經常需要跨域訪問。這裡主要介紹一下 php 中怎麼解決跨域問題。1 允許所有網域名稱訪問header access control allow origin 2 允許單個網域名稱訪問header access control allow origin 3 允許多個...

Jsonp的跨域詳析

什麼是跨域訪問 在a 中,我們希望使用ajax來獲得b 中的特定內容。如果a 與b 不在同乙個域中,那麼就出現了跨域訪問問題。同源策略規定,瀏覽器的ajax只能訪問跟它的html頁面同源 相同網域名稱或ip 的資源。什麼是jsonp jsonp json with padding 是json的一種 ...

跨域 springboot 解決前後端跨域

cors協議 h5中的新特性 cross origin resource sharing 跨域資源共享 通過它,我們的開發者 主要指後端開發者 可以決定資源是否能被跨域訪問。cors是乙個w3c標準,它允許瀏覽器 目前ie8以下還不能被支援 像我們不同源的伺服器發出xmlhttprequest請求,...