什么是跨域？怎么解决跨域问题？

　　　　跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。

　　　　　所谓同源是指，域名，协议，端口均相同

　　　　http://www.123.com/index.html 调用 http://www.123.com/server.PHP （非跨域）

　　　　　http://www.123.com/index.html 调用 http://www.456.com/server.php （主域名不同:123/456，跨域）

　　　　　http://abc.123.com/index.html 调用 http://def.123.com/server.php （子域名不同:abc/def，跨域）

　　　　　http://www.123.com:8080/index.html 调用 http://www.123.com:8081/server.php （端口不同:8080/8081，跨域）

　　　　　http://www.123.com/index.html 调用 https://www.123.com/server.php （协议不同:http/https，跨域）

　　　　　请注意：localhost和127.0.0.1虽然都指向本机，但也属于跨域。

　　　　　浏览器执行javascript脚本时，会检查这个脚本属于哪个页面，如果不是同源页面，就不会被执行。

　　　　

　　　　　比如:我在本地上的域名是127.0.0.1:8000,请求另外一个域名：127.0.0.1:8001一段数据

　　　　　浏览器上就会报错，个就是同源策略的保护,如果浏览器对javascript没有同源策略的保护,那么一些重要的机密网站将会很危险

已拦截跨源请求：同源策略禁止读取位于 http://127.0.0.1:8001/SendAjax/ 的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-Origin'）。

 

解决办法：

　　　　1、JSONP

　　　　　　JSONP原理

 

　　　　　　　　ajax请求受同源策略影响，不允许进行跨域请求，而script标签src属性中的链接却可以访问跨域的js脚本，利用这个特性，服务端不再返回JSON格式的数据，而是返回一段调用某个函数的js代码，在src中进行了调用，这样实现了跨域。

　　　　　　　　但是要注意JSONP只支持GET请求，不支持POST请求。

　　　　　2、代理：

　　　　　　　　例如www.123.com/index.html需要调用www.456.com/server.php，可以写一个接口www.123.com/server.php，由这个接口在后端去调用www.456.com/server.php并拿到返回值，然后再返回给index.html，这就是一个代理的模式。相当于绕过了浏览器端，自然就不存在跨域问题。

　　　　　3、PHP端修改header（XHR2方式）

　　　　　　　　在php接口脚本中加入以下两句即可：

　　　　　　　　header('Access-Control-Allow-Origin:*');//允许所有来源访问

　　　　　　　　header('Access-Control-Allow-Method:POST,GET');//允许访问的方式

　　　　4

　　　　安装django-cors-headers模块

　　　　　　在settings.py中配置
　　　　 注册app
　　　　　　INSTALLED_APPS = [

　　　　　　　　'corsheaders'
　　　　　　　　]
　　　　 添加中间件
　　　　　　MIDDLEWARE = [

　　　　　　　　'corsheaders.middleware.CorsMiddleware'
　　　　　　　　]
　　　　允许跨域源
　　　　　　　　CORS_ORIGIN_ALLOW_ALL = True

　　　　5自己写：（1）CORS（跨域资源共享）简介

 　　　　　　　　CORS需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能，IE浏览器不能低于IE10。

　　　　　　　　整个CORS通信过程，都是浏览器自动完成，不需要用户参与。对于开发者来说，CORS通信与同源的AJAX通信没有差别，代码完全一样。浏览器一旦发现AJAX请求跨源，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感觉。

　　　　　　　　因此，实现CORS通信的关键是服务器。只要服务器实现了CORS接口，就可以跨源通信。

　　　　（2）CORS基本流程;

　　　　　　浏览器将CORS请求分成两类：简单请求（simple request）和非简单请求（not-so-simple request）。
浏览器发出CORS简单请求，只需要在头信息之中增加一个Origin字段。
浏览器发出CORS非简单请求，会在正式通信之前，增加一次HTTP查询请求，称为"预检"请求（preflight）。浏览器先询问服务器，当前网页所在的域名是否在服务器的许可名单之中，以及可以使用哪些HTTP动词和头信息字段。只有得到肯定答复，浏览器才会发出正式的XMLHttpRequest请求，否则就报错。

　　　　（3）CORS两种请求详解

　　　　　　　　只要同时满足以下两大条件，就属于简单请求。

（1) 请求方法是以下三种方法之一：
HEAD
GET
POST
（2）HTTP的头信息不超出以下几种字段：
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

凡是不同时满足上面两个条件，就属于非简单请求。

浏览器对这两种请求的处理，是不一样的

* 简单请求和非简单请求的区别？

   简单请求：一次请求
   非简单请求：两次请求，在发送数据之前会先发一次请求用于做“预检”，只有“预检”通过后才再发送一次请求用于数据传输。
* 关于“预检”

- 请求方式：OPTIONS
- “预检”其实做检查，检查如果通过则允许传输数据，检查不通过则不再发送真正想要发送的消息
- 如何“预检”
     => 如果复杂请求是PUT等请求，则服务端需要设置允许某请求，否则“预检”不通过
        Access-Control-Request-Method
     => 如果复杂请求设置了请求头，则服务端需要设置允许某请求头，否则“预检”不通过
        Access-Control-Request-Headers

支持跨域，简单请求

服务器设置响应头：Access-Control-Allow-Origin = '域名' 或 '*'

支持跨域，复杂请求

由于复杂请求时，首先会发送“预检”请求，如果“预检”成功，则发送真实数据。

• “预检”请求时，允许请求方式则需服务器设置响应头：Access-Control-Request-Method
• “预检”请求时，允许请求头则需服务器设置响应头：Access-Control-Request-Headers

Django项目中支持CORS

 在返回的结果中加入允许信息（简单请求）

def test(request):
    import json
    obj=HttpResponse(json.dumps({'name':'lqz'}))
    # obj['Access-Control-Allow-Origin']='*'
    obj['Access-Control-Allow-Origin']='http://127.0.0.1:8001'
    return obj

 放到中间件处理复杂和简单请求（自己新建个py文件写完下面的代码，再去把他加到你项目的中间件的第一个）

from django.middleware.security import SecurityMiddleware
from django.utils.deprecation import MiddlewareMixin
class MyCorsMiddle(MiddlewareMixin):
    def process_response(self, request, response):
        if request.method == 'OPTIONS':
            # 允许它
            response['Access-Control-Allow-Headers'] = 'Content-Type'
            # obj['Access-Control-Allow-Headers']='*'

        　　　# obj['Access-Control-Allow-Origin']='http://127.0.0.1:8000'
        response['Access-Control-Allow-Origin'] = '*'
        return response