jsonp原理,跨域請求頭處理
一.jsonp(解決跨域)思路介紹:
因瀏覽器的同源策略不會攔截link標籤內的src請求,所以利用這一點,我們把後端開放的介面路徑放在src內,
其在傳送請求後會自動接收返回的東西,所以我們可以給要返回的內容進行特殊的處理;具體做法:
1. 使用個變數加括號的形式,把要返回的內容放入括號內
列如: return HttpResponse( "handlerResponse('返回內容')" )
2. 在html頁面script標籤對內放置個函式,讓函式名等同於後端傳來的變數名即可
function handlerResponse(data) { # data引數接收的就是後端真正想要返回的內容
// do something....
alert(data)
}
3. 原理: 前端src出接收到的內容就是handlerResponse('返回內容')這種形式,而html頁面內又定義了
handlerResponse為一個函式名,加括號就是呼叫的形式,正好會把其所要傳送的東西以引數的形式被
data所接收,此時在函式內操作處理即可.
缺點: jsonp只能傳送get請求,無法處理post請求,且get請求時無法指定
二.加請求頭方式:
我們先了解下跨域請求的分類(簡單和複雜):
HTTP方法是下列方法之一
HEAD, GET,POST
HTTP頭資訊不超出以下幾種欄位
Accept, Accept-Language, Content-Language, Last-Event-ID
Content-Type只能是下列型別中的一個
application/x-www-from-urlencoded # form表單提交資料
multipart/form-data # 許可權型別
text/plain # 文字型別
任何一個不滿足上述要求的請求,即會被認為是複雜請求~~
複雜請求會先發出一個預請求,我們也叫預檢,即OPTIONS請求~~
原理,在請求返回給瀏覽器前,給響應內容加上頭部資訊,讓瀏覽器放行即可.
from django.utils.deprecation import MiddlewareMixin
class MyCors(MiddlewareMixin):
def process_response(self, request, response):
response["Access-Control-Allow-Origin"] = "*" # 放行所有簡單請求
if request.method == "OPTIONS":
# 複雜請求會先發預檢
response["Access-Control-Allow-Headers"] = "Content-Type" # 內容型別
response["Access-Control-Allow-Methods"] = "PUT,PATCH,DELETE" # 複雜請求方式
return response