本質(zhì)原因是同源策略狂男，瀏覽器會(huì)檢查 域名協(xié)議端口综看。
注意請(qǐng)求可以發(fā)過(guò)去，接收也可以岖食，但是被瀏覽器阻止了红碑。
瀏覽器為什么會(huì)阻止呢？原因是跨域泡垃，XHR(XMLHttpRequest) 請(qǐng)求
有兩種方式可以解決
- jsonp
前端利用 script 標(biāo)簽去請(qǐng)求析珊。如果利用 ajax 的方式去請(qǐng)求呢，其實(shí)就是往頁(yè)面中添加 script 標(biāo)簽蔑穴。這樣的話(huà)忠寻，請(qǐng)求類(lèi)型是 script 類(lèi)型，這樣瀏覽器就不會(huì)禁止了存和。
function test(arg) {
var data=JSON.parse(arg);
}
function get_jsonp_data(url) {
var ele_script=$("<script>");
ele_script.attr("src": url);
ele_script.attr("id", "jsonp");
$("body").append(ele_script);
$("#jsonp").remove()
}
// 點(diǎn)擊一個(gè) button 來(lái)請(qǐng)求
$(".get_service").click(function() {
$.ajax({
url: 'url',
dataType: 'jsonp',
jsonp:'callbacks',
// jsonpCallback:"test", 指定具體回調(diào)函數(shù)锡溯，jquery 會(huì)隨機(jī)生成字符串
success: function (data) {
console.log()
}
})
});
// 服務(wù)器解析然后返回字符串
-------------->>>> server >>>>--------------
func = request.GET.get('callbacks')
r = {"name": 'asd', "age", 23}
return HttpResponse("%s(%s)"%(func, json.dumps(info)))
// 這里 func 相當(dāng)于 test
// 然后返回給瀏覽器一串字符，瀏覽器解析 script 標(biāo)簽進(jìn)行 函數(shù)調(diào)用哑姚，相當(dāng)于 test(r)
- CORS
又分為簡(jiǎn)單請(qǐng)求和復(fù)雜請(qǐng)求
只要滿(mǎn)足以下條件祭饭，就屬于簡(jiǎn)單請(qǐng)求
（1) 請(qǐng)求方法是以下三種方法之一：HEAD GET POST
（2）HTTP的頭信息不超出以下幾種字段：
AcceptAccept-Language
Content-LanguageLast-Event-ID
Content-Type：只限于三個(gè)值application/x-www-form-urlencoded、multipart/form-data叙量、text/plain
兩者區(qū)別
簡(jiǎn)單請(qǐng)求：一次請(qǐng)求
非簡(jiǎn)單請(qǐng)求：兩次請(qǐng)求倡蝙，在發(fā)送數(shù)據(jù)之前會(huì)先發(fā)一次請(qǐng)求用于做“預(yù)檢”，只有“預(yù)檢”通過(guò)后才再發(fā)送一次請(qǐng)求用于數(shù)據(jù)傳輸绞佩。
- 關(guān)于“預(yù)檢”
請(qǐng)求方式：OPTIONS
“預(yù)檢”其實(shí)做檢查寺鸥，檢查如果通過(guò)則允許傳輸數(shù)據(jù)猪钮，檢查不通過(guò)則不再發(fā)送真正想要發(fā)送的消息
- 如何“預(yù)檢”
=> 如果復(fù)雜請(qǐng)求是PUT等請(qǐng)求，則服務(wù)端需要設(shè)置允許某請(qǐng)求胆建，否則“預(yù)檢”不通過(guò)
Access-Control-Request-Method
=> 如果復(fù)雜請(qǐng)求設(shè)置了請(qǐng)求頭烤低，則服務(wù)端需要設(shè)置允許某請(qǐng)求頭，否則“預(yù)檢”不通過(guò)
Access-Control-Request-Headers
- 支持跨域笆载，簡(jiǎn)單請(qǐng)求
服務(wù)器設(shè)置響應(yīng)頭：Access-Control-Allow-Origin = '域名' 或 '*'
# Django 的返回
ret = HttpResponse()
ret["Access-Control-Allow-Origin"] = "域名"
return ret
- 支持跨域扑馁，復(fù)雜請(qǐng)求
由于復(fù)雜請(qǐng)求時(shí)，首先會(huì)發(fā)送“預(yù)檢”請(qǐng)求凉驻，如果“預(yù)檢”成功腻要，則發(fā)送真實(shí)數(shù)據(jù)。
“預(yù)檢”請(qǐng)求時(shí)涝登，允許請(qǐng)求方式則需服務(wù)器設(shè)置響應(yīng)頭：Access-Control-Request-Method
“預(yù)檢”請(qǐng)求時(shí)雄家，允許請(qǐng)求頭則需服務(wù)器設(shè)置響應(yīng)頭：Access-Control-Request-Headers
