#同源策略(ip port 协议全部相同)

#本站的只能请求本站域名的数据 

#CORS实现（跨域资源共享)

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

#CORS基本流程

#1_CORS请求分成两类：简单请求（simple request）和非简单请求（not-so-simple request）

#2_满足一下为简单请求

（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

#3_简单请求和非简单请求的区别？

   简单请求：一次请求

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

* 关于“预检”

-  预检请求方式：OPTIONS

- “预检”其实做检查，检查如果通过则允许传输数据，检查不通过则不再发送真正想要发送的消息

- 如何“预检”

     => 如果复杂请求是PUT等请求，则服务端需要设置允许某请求，否则“预检”不通过

        Access-Control-Request-Method

     => 如果复杂请求设置了请求头，则服务端需要设置允许某请求头，否则“预检”不通过

        Access-Control-Request-Headers

from django.utils.deprecation import MiddlewareMixin

#view局部

    def test(request):

        ret=HttpResponse('ok')

       #允许http://127.0.0.1:8001域向我发请求

        ret['Access-Control-Allow-Origin'] = 'http://127.0.0.1:8000'

        if request.method == 'OPTIONS':

            # 所有的头信息都允许

            ret['Access-Control-Allow-Headers'] = '*'

        return ret

#设置中间件(全局)

class xxx(MiddlewareMixin):

    def process_response (self, request, response):

        # 简单请求:

        # 允许http://127.0.0.1:8001域向我发请求

        # ret['Access-Control-Allow-Origin']='http://127.0.0.1:8001'

        # 允许所有域向我发请求

        response['Access-Control-Allow-Origin'] = '*'

        if request.method == 'OPTIONS':

            # 所有的头信息都允许

            response['Access-Control-Allow-Headers'] = '*'

        return response

django中的cors（view设置以及中间件设置）

vue中的ajax:

    axios

    安装:npm install axios

    使用:

        -先在main.js中配置:

            import axios from 'axios'

            Vue.prototype.$http=axios

        -在组件中:

            methods: {

            btton_click: function () {

                //取到对象

                let cc = this

                cc.$http.request({

                    //向其它域请求数据

                    url: 'http://127.0.0.1:8000/test/',

                    method: 'post',
　　　　　　　　　　　　data:{
　　　　　　　　　　　　//携带数据
}

                }).then(function (response) {

                    //拿到原数据对象，更新

                    cc.course = response.data

                }).catch(function (response) {

                    //请求失败

                })

            }

        }