day22

如果是form表单 直接在表单里增加 {% csrf_token %} 这个就好了

方式一：

个人觉得用这个方便

添加请求头 就不是data里的值了 
<script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.js"></script>  ##这里走的是cdn 应该导入文件
    $.ajax({
         headers:{"X-CSRFToken":$.cookie('csrftoken')},
         })    
#实现原理：通过jquery操作cookie拿到key对应的值

方式二：

            data:{
                csrfmiddlewaretoken:$('[name="csrfmiddlewaretoken"]').val()
            },

实现的原理：
            在html的某一个位置 写上 {% csrf_token %} 这样会在页面渲染一个 这样的input标签
            <input type="hidden" name="csrfmiddlewaretoken" 
            value="fQLSrDayErQNNzyvxLNa7WcmHKuJtwOxdjUmqOymnLUOkGFJDwGwFRshOjFoamHO">
            通过在data里的设置拿到key-csrfmiddlewaretoken对应的value，key不变，主要就是拿到固定key对应的value这个随机字符串

方式三：

        $.ajax({
            data:{
                csrfmiddlewaretoken:$.cookie("csrfmiddlewaretoken")
            },    
        或者：
        <script src="{% static 'js/jquery.cookie.js' %}"></script>
        $.ajax({
        headers:{"X-CSRFToken":$.cookie('csrftoken')},
        })    
实现原理：
　　　　利用jquery操作cookie拿到key-csrfmiddlewaretoken对应的value

 

 

 

 

1.确定事件

ajax不会闲的没事自己触发执行，需要事件去触发执行呢

例如：放在button的click事件中
        <button class="ajax1">ajaxsend</button><span class="info"></span>
        <script>
            $('button').click(function () {
                $.ajax({
                    url:'/sendajax/',
                    type:'get',
                    success:function (data) {
                        $('.info').html(data)
                    }
                })
            })
        </script>

2.格式以及必要参数

$().ajax({
        url:'/sendajax/', #必选参数 路径
        success:function () {} #必选参数 如果成功的话就执行函数  (data)接收的是服务端返回给客户端的数据
        type:'get' or 'post' #默认为get 大小写均可
        data:{                #发送给服务端的数据 自己组建键值对
            "k1":"v1",
            "k2":"v2"    
        } 
    })

3.ajax的参数

$().ajax({
        url:'/sendajax/', #必选参数 路径
        success:function () {} #必选参数 如果成功的话就执行函数  (data)接收的是服务端返回给客户端的数据
        type:'get' or 'post' #默认为get 大小写均可
        data:{                #发送给服务端的数据 自己组建键值对 当前ajax请求要携带的数据，是一个json的object对象，ajax方法就会默认地把它编码成某种格式
            "k1":"v1",
            "k2":"v2"    
        } 
　　　　error: function (jqXHR, textStatus, err) 
　　　　　　　　{  
                // jqXHR: jQuery增强的xhr 
                // textStatus: 请求完成状态 
               // err: 底层通过throw抛出的异常对象，值与错误类型有关  err是错误信息
              console.log(arguments); },
    })

 比较重要的一个参数 contentType

    默认值: contentType:"application/x-www-form-urlencoded",     数据格式：?user=alex&pwd=123
    其他方式: contentType:"application/json",                     数据格式：{"user":"alex","pwd":"123"}  字典格式 双引号 
        
    服务端取数据：
    这样取出来的数据并不是元数据，是字典，是经过包装的
    name=request.POST.get('name')
    pwd=request.GET.get('pwd') #{"user":"alex","pwd":"123"}
    
    我们直接取出的数据，经过了Django的处理 处理过程基本是
    服务端识别客户端的编码 "application/x-www-form-urlencoded" 
    通过request.body() 拿到的数据是：?user=alex&pwd=123
    然后Django自己处理数据格式 
    我们通过
    name=request.POST.get('name')
    pwd=request.GET.get('pwd') #{"user":"alex","pwd":"123"}
    拿到的是字典 也就是Django从request.body()里 处理好格式的数据
    ##注意 request.POST/GET.get() 这种取值的方式对应的就是客户端使用"application/x-www-form-urlencoded"这种编码，如果换了，用这种方法可就不一定能取出值来了
    但是request.body()是一定可以的，这里可是元数据哦
    
    如果用 "application/json" 这种方式发送数据 发送的是json字符串
    首先用request.POST/GET.get() 肯定是拿不到数据了
    现在客户端发给服务端的是json字符串，服务端拿到的是json字符串，服务端不认识json数据，需要 
    import json
    obj=request.body() #b’name=yuan&pwd=123'  是个bytes类型
    json.loads(obj) 反序列化
    
    对比一下：
    request.POST   # <QueryDict:{'name':['yuan'],'pwd':'[123]'}>
    request.GET    # <QueryDict:{'name':['yuan'],'pwd':'[123]'}>
    request.body   # b’name=yuan&pwd=123' 是个bytes类型