Ajax简介_ajax属于js吗-CSDN博客

$.ajax({
    url:''.      // 控制数据的提交地址
    type:'',     //  控制请求方式(默认get请求)
    data:{},      // 组织提交的数据
    success: function(形参){
            异步回调函数
       }
})

数据编码格式

可以朝后端发送post请求的方式有两种，form表单和Ajax请求。

前后端传输数据的编码格式：

urlencoded
formdata
json

form表单中

默认的数据编码是urlencoded
数据格式：username=yietong&password=123
Django后端会针对符合urlencoded编码格式的数据帮你解析封装到request.POST中
如果编码格式改为formdata，那么针对普通的键值对还是解析到request.POST中，而文件则解析到request.FILES中。
form表单无法发送json格式数据

Ajax中

默认编码也是urlencoded
数据格式：username=yietong&pwd=123
Django后端会针对符合urlencoded编码格式的数据帮你解析封装到request.POST中

Ajax发送json格式数据

contentType参数指定为application/json
数据必须是json格式的
Django后端不会处理json格式的数据，需要到request.body获取并处理

<body>
    <div class="container">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">ajax测试:
                <input type="text" id="d1" name="test">
                <button class="btn btn-success btn-group-sm" id="d2">提交ajax请求</button>
            </div>
        </div>
    </div>

    <script>
        $('#d2').click(function () {<!--给input标签绑定一个单击事件-->
            $.ajax({
                url:'',
                type:'post',
                data: JSON.stringify({'input':$('#d1').val()}),<!--数据必须是json格式-->
                contentType:'application/json',<!--数据格式必须是'application/json'-->
                success: function (args) {
                    console.log(this.data, typeof this.data)
                }
            })
        })
    </script>
</body>

path('ajax/', views.ajax),

def ajax(request):
    if request.method == "POST":
        print(request.POST)  # <QueryDict: {}>
        print(request.FILES)  # <MultiValueDict: {}>
        print(request.body)  # b'{"data":"ajax\xe6\xb5\x8b\xe8\xaf\x95"}'
        import json
        res = json.loads(request.body)
        print(res, type(res))  # {'data': 'ajax测试'} <class 'dict'>
    return render(request, 'ajax.html')

content-type

格式1: urlencoded

数据格式: name=yietong&pwd=123&hobby=read

django 后端统一处理到request.POST中

格式2:formdata

数据格式: 无法查阅

django后端自动将文件数据处理到request.FILES, 普通数据request.POST

格式3: application/json

数据格式: json格式

django后端不会处理, 在request.body中存储bytes类型的数据. 需要自己处理,

语法注意事项:
data:JSON.stringfy({'name':'yietong','pwd':123}),
contentType:'application/json'.

ajax携带数据

Ajax发送文件需要借助js内置对象FromData

$('#d3').click(function(){
    // 1. 产生内置对象
    let formData = new FoemData();
    // 2. 添加普通数据
    formData.append('username',$('#d1').val())
    // 3.添加文件数据
    formData.append('file',$('#d2')[0].files[0])
    // 4. 发送ajax请求
    $.ajax({
    url:'',
    type:'post',
    data:formData,
    contentType:false,   // 不使用任何编码
    processData:false,   //部处理数据对象
    success:function(args){
        }
    })
})

回调函数

后端跟ajax交互, 不应该在返回页面, 通常情况下都是返回json格式数据

前端针对HttpResponse 和 JsonResponse 返回的json 格式数据处理策略不同,

前者不会自动反序列化, 后者会自动反序列化

如果想让前者也自动反序列化,可以添加一个固定参数>>> dataType:'JSON'

<body>
    <input type="text" id="d1">
    <button class="btn" id="d2">ajax请求</button>

    <script>
        $('#d2').click(function () {
            $.ajax({
                url:'',
                type:'post',
                data: '',
                success:function (args) {
                    console.log(args, typeof args)
                    $('#d1').val(args)
                }
            })
        })
    </script>
</body>

def callback(request):
    if request.method == 'POST':
        return HttpResponse("{'name': 'yietong', 'age': 22}")
    return render(request, 'callback.html')

序列化

首先，从djang.core导入它，然后调用它的serialize方法，这个方法至少接收两个参数，第一个是你要序列化成为的数据格式，这里是‘jsonl’，第二个是要序列化的数据对象，数据通常是ORM模型的QuerySet，一个可迭代的对象。

def ser(request):
    user_list = models.Book.objects.all()
    from django.core import serializers
    res = serializers.serialize('json', user_list)
    return HttpResponse(res)

响应状态码

HTTP协议：hypertext transport protocol（超文本传输协议），协议详细规定了浏览器和万维网服务器之间互相通信的规则。（一种约定，规则）

状态码分类	说明
1xx	响应中——临时状态码，表示请求已经接受，告诉客户端应该继续请求或者如果它已经完成则忽略它
2xx	成功——表示请求已经被成功接收，处理已完成
3xx	重定向——重定向到其它地方：它让客户端再发起一个请求以完成整个处理。
4xx	客户端错误——处理发生错误，责任在客户端，如：客户端的请求一个不存在的资源，客户端未被授权，禁止访问等
5xx	服务器端错误——处理发生错误，责任在服务端，如：服务端抛出异常，路由出错，HTTP版本不支持等

常见响应状态码：

状态码

响应状态字符

说明

200

客户端请求成功，即处理成功，这是我们最想看到的状态码

302

Found

指示所请求的资源已移动到由Location响应头给定的 URL，浏览器会自动重新访问到这个页面

304

Not Modified

告诉客户端，你请求的资源至上次取得后，服务端并未更改，你直接用你本地缓存吧。隐式重定向