django - CORS

CORS 跨域問題

跨域是由於 瀏覽器 的 同源策略 導致的問題

請求地址的組成

例：http://www.baidu.com:80/s?keywords=圖片

• http : schema，是一種協議
• www.baidu.com 是域名
• 80 : 是默認的端口，可以省略
• /s 是請求地址
• keywords=圖片 請求參數

什麼是同源策略？

指的是 協議相同、域名相同、端口相同

http://www.baidu.com/s
http://www.baidu.com:8000/s
https://www.baidu.com/s
http://wenku.baidu.com/s

*.baidu.com (二級域名)

跨域的解決方案

• <script> 標籤的跨域
• jsonp 跨域，json 的原理就是 <script> 標籤

後臺返回的默認是一個 JSON 對象，如何讓後臺返回一個 JS 代碼？

[1, 2, 3, 4]
{name:"zhansan", ...}

test([1, 2, 3, 4])
test({name:"zhansan", ...})

在頁面上，定義一個 test 函數

jsonp 在使用的時候，要求後端必須支持，後端返回的不是一個標準的 JSON，
而是一個形似 javascript 函數的表示形式

CORS (Cross-Origin Resource Sharing)

通過 CORS: Cross-Origin Resource Sharing（跨站資源共享）策略，來實現跨域

解決方案：主要在後端服務器上、在響應的頭信息上，添加一個 Access-Control-Allow-Origin = * 這樣的頭信息即可。

DRF 中如何解決跨域問題

DRF 是通過 django-cors-headers 來解決跨域的問題，在 DRF 中引入 django-cors-headers 的步驟如下：

1. pip install django-cors-headers
2. 在 INSTALLED_APPS 中，添加 "corsheaders"
3. 在 settings.py 配置文件中，middlewares 中添加中間件 corsheaders.middleware.CorsMiddleware
4. 在 settings.py 中，

   # 配置跨域的屬性 
   CORS_ORIGIN_ALLOW_ALL = False 
   # 如果設置爲 True，白名單失效，則允許所有的網站都可以跨域訪問
   
   # 設置跨域的白名單
   CORS_ORIGIN_WHITELIST = [
      'http://www.baidu.com',
      'http://www.sina.com',
   ]
   

CORS 除了在響應的頭信息上設置 Access-Control-Allow-Origin 來允許某個資源進行跨域，還可以通過 反向代理 的技術進行跨域；
在反向代理的時候，需要在代理服務器上設置 Access-Control-Allow-Origin

• <iframe> 標籤跨域