目录

    1. 同源策略

    同源策略是浏览器的安全基石。 同源的定义,包括三个方面:

    • 协议相同
    • 域名相同
    • 端口相同

    限制范围:

    • Cookie、LocalStorage 和 IndexDB 无法读取
    • DOM 无法获得
    • AJAX 请求不能发送

    简单说,协议、域名、端口三者任意不同的两个 URL 之间不允许通信,范围包括获取对方 Cookie,DOM,发送 AJAX 请求。

    2. 跨域通信

    • 共享 Cookie。一级域名相同,二级域名不同,可以共享 Cookie 实现跨域。
    • 片段识别符。http://x.com/x.html#data,URL# 后面的 data 指的就是片段标识符,iframe 可以获取到 data,从而实现跨域。
    • window.name。无论是否同源,只要在同一个窗口里,前一个网页设置了 window.name ,后一个网页可以读取它。
    • window.postMessage。跨文档通信 API ,允许跨窗口通信,不论这两个窗口是否同源。

    3. AJAX

    • JSONP 网页添加一个script元素,向服务器请求JSON数据,服务器收到请求后,将数据放在一个指定的回调函数里。但是,只能发GET请求。
    • WebSocket WebSocket是一种通信协议,使用ws://(非加密)和wss://(加密)作为协议前缀。该协议不实行同源政策,因为Origin字段可以设置请求源。
    • CORS CORS 需要浏览器和服务器同时支持,CORS 通信与同源的 AJAX 通信没有差别。 浏览器一旦发现 AJAX 请求跨源,就会自动添加一些附加的头信息 服务器端需要设置,(1)Access-Control-Allow-Origin 允许的源,(2)Access-Control-Allow-Credentials 是否发送 Cookie 和 HTTP 认证信息,(3)Access-Control-Expose-Headers 允许脚本访问的返回头。

    4. django-cors-headers

    安装

    pip install django-cors-headers
    

    settings.py配置

    INSTALLED_APPS = (
        'corsheaders',
    )
    MIDDLEWARE = [  
        'corsheaders.middleware.CorsMiddleware',
        'django.middleware.common.CommonMiddleware',
    ]
    CORS_ALLOW_HEADERS = (
        'accept',
        'accept-encoding',
        'authorization',
        'content-type',
        'dnt',
        'origin',
        'user-agent',
        'x-csrftoken',
        'x-requested-with',
    )
    
    CORS_ORIGIN_ALLOW_ALL = True
    CORS_ALLOW_CREDENTIALS = True
    

    更详细的配置,可以去项目主页,Go

    5. 参考