關於前端跨域請求的解決方法

2021-09-25 17:57:03 字數 861 閱讀 4498

近期在做專案(前後端業務分離),遇到跨域請求失敗的問題,記錄一下,報錯資訊如下:

access to xmlhttprequest at '' from origin 'http://localhost:8000' has been blocked by cors policy: no 'access-control-allow-origin' header is present on the requested resource.
一、先說說什麼是跨域請求。跨域請求是指在本站內訪問其他站點資源,瀏覽器的同源策略(安全機制)會導致跨域請求的失敗。

同源是指協議、網域名稱、埠號均相同。

另外需要注意的是,localhost與127.0.0.1雖然都指向本機位址,但也屬於跨域。

二、解決辦法有2種

1、前端設定**

在前端設定**,以**身份請求第三方介面,比如:

前端專案位址為:服務端專案位址為:設定**身份為192.168.2.10,這樣前端請求介面的時候以**身份請求介面位址,也就是同源了。

2.後端設定

在控制器(controller)上加上註解@crossorigin即可(服務端專案環境為:springboot+spring+springmvc+hibernate+mysql)

@crossorigin//解決跨域請求問題

@restcontroller

public class goodscontroller {

如上設定即可實現跨域請

跨域請求的幾種解決方法

跨域請求 兩個不同網域名稱之間的通訊。ajax受到瀏覽器的限制 安全性考慮 不允許跨域通訊。報錯 req.send script 預設情況下瀏覽器採用同源策略 乙個域下面的js只能請求同乙個域下面的文件內容,不能跨域請求。1.1 解決方法一 src屬性 使用標籤的src屬性,src屬性是沒有同源的限...

Jquery使用AJAX請求跨域解決方法

在解決方法中使用到jsonp 首先了解jsonp的原理 jsonp原理 jsonp其實就是乙個跨域解決方案。js跨域請求資料是不可以的,但是js跨域請求js指令碼是可以的。可以把資料封裝成乙個js語句,做乙個方法的呼叫。跨域請求js指令碼可以得到此指令碼。得到js指令碼之後會立即執行。可以把資料做為...

cors跨域請求排查與解決方法

與第三方對接,發現options請求正常,但是剩下的get請求沒發出去。在瀏覽器中模擬請求,獲取報錯資訊。重點資訊 request header field x requested with is not allowed by access control allow headers in pref...