鍍金池/ 問答/HTML/ $.ajax如何跨域訪問?

$.ajax如何跨域訪問?

直接請求
clipboard.png

不支持跨域,報錯了
clipboard.png

jsonp

clipboard.png

報錯了

clipboard.png

錯誤點(diǎn)進(jìn)來,是這樣的形式報錯

clipboard.png
看看接口調(diào)用情況,狀態(tài)是200, 返回值也是有的

clipboard.png

現(xiàn)在我該怎么做? 在服務(wù)端不設(shè)置響應(yīng)頭的情況下,我如何請求這個api?

回答
編輯回答
尤禮

上面的回答是cors方式跨域
題主最后有結(jié)果但是沒數(shù)據(jù)是因為jsonp方式要求返回js的object對象,而不是json
這是兩種不同的方式

2017年2月4日 03:58
編輯回答
歆久

使用類似charles的代理工具吧,在開發(fā)的時候

2018年2月10日 03:25
編輯回答
幼梔

瀏覽器是不支持跨域的,ajax請求的時候用jsonp,之后還要在你要在服務(wù)器端做處理才可以;
在服務(wù)器端加上header信息,

header('Access-Control-Allow-Origin: *'); //允許所有域名的腳本訪問該資源。
header("Access-Control-Allow-Headers: token,Origin, X-Requested-With, Content-Type, Accept"); //表明允許跨域請求包含content-type頭
header('Access-Control-Allow-Methods: POST,GET'); //請求方式
2018年2月6日 12:11
編輯回答
陪妳哭

版本號49之后的chrome跨域設(shè)置
chrome的版本升到49之后,跨域設(shè)置比以前嚴(yán)格了,在打開命令上加--disable-web-security之后還需要給出新的用戶個人信息的目錄。眾所周知chrome是需要用gmail地址登錄的瀏覽器,登錄后就會生成一個存儲個人信息的目錄,保存用戶的收藏、歷史記錄等個人信息。49版本之后,如果設(shè)置chrome瀏覽器為支持跨域模式,需要指定出一個個人信息目錄,而不能使用默認(rèn)的目錄,估計是chrome瀏覽器怕用戶勿使用跨域模式泄露自己的個人信息(主要是cookie,很多網(wǎng)站的登錄token信息都是保存在cookie里)。

具體做法為:

1.在電腦上新建一個目錄,例如:C:MyChromeDevUserData

2.在屬性頁面中的目標(biāo)輸入框里加上 --disable-web-security --user-data-dir=C:MyChromeDevUserData,--user-data-dir的值就是剛才新建的目錄。

3.點(diǎn)擊應(yīng)用和確定后關(guān)閉屬性頁面,并打開chrome瀏覽器。

再次打開chrome,發(fā)現(xiàn)有“--disable-web-security”相關(guān)的提示,說明chrome又能正常跨域工作了。

圖片描述

2018年7月26日 18:57
編輯回答
胭脂淚

補(bǔ)充下,jsonp其實在跨域原理上跟js更近,它要求服務(wù)端返回一段帶有object的js代碼,然后利用js標(biāo)簽里的src默認(rèn)沒有跨域限制的特性(準(zhǔn)確來講是網(wǎng)頁沒配置csp的話沒有跨域限制,但同時也犧牲了一部分安全性),用src來加載,這樣就能獲取到object里的數(shù)據(jù)了。同時,由于是和json一脈相承的js.object,jQ讓代碼看上去像是在加載json……(什么鬼)

CORS方式則要求服務(wù)端返回的時候要帶個CORS頭,標(biāo)明允許跨域訪問的域(當(dāng)然也可以圖省事用通配符*),但我個人覺得如果本域有能力控制后端的話,配置個轉(zhuǎn)發(fā)代理是個更好的選擇,因為這樣前端就不存在跨域問題了。轉(zhuǎn)發(fā)代理可以用Nginx做,另外可能在域名解析那里設(shè)置URL轉(zhuǎn)發(fā)應(yīng)該也行(最近剛發(fā)現(xiàn)的,萬網(wǎng)有URL顯式/隱式轉(zhuǎn)發(fā),不過還沒試過)。

2017年1月11日 20:09
編輯回答
我甘愿

跨域不管是jsonp還是Access-Control-Allow-Origin都需要服務(wù)端支持

2018年7月23日 00:33