ajax的基础语法、数据编码、回调函数、以及django序列化orm数据对象

Ajax

定义

ajax在不重新加载整个页面的情况下,就可以与服务器交换数据并更新部分网页的内容。真正的做到了局部刷新,异步提交。我们可以在很多功能上都可以用ajax替代掉form表单提交数据的方式,并且体验更好。

基础语法

$.ajax({
  url:'',                  # 控制数据发送的路径,默认为页面显示的地址 
  type:'',                 # 控制请求方法,默认就是get请求
  data:{},                 # 组织提交的数据
  success:function(形参){
    #异步回调函数
  }
})

数据编码格式(Content-Type)

urlencoded

是默认的传输数据格式,数据格式为:name=jason&pwd=123&hobby=read

在django后端同一处理到request.POST中

formdata

数据格式:无法查阅

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

application/json

数据格式:json格式

django后端不会处理,在request.body中存储(bytes类型),需要我们自己做反序列化

语法注意事项

data:stringify({'name':'jason','pwd':123})
contentType:'application/json'

ajax携带文件数据

    $('#d5').click(function () {
       // 产生内置对象
        let formDate=new FormData()
        // 添加普通数据,文件数据
        formDate.append('username',$('#d1'))
        formDate.append('file',$('#d4')[0].files[0])
        // 发送ajax请求
        $.ajax({
            url:'',
            type:'post',
            data:formDate,
            contentType:false,   // 不使用任何数据格式
            processData:false,   // 不处理数据内容
            success:function () {
                // 回调函数
            }
        })
    })

回调函数

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

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

HttpResponse

ajax接收其返回值的时候不会自动进行反序列化,需要我们自己用反序列化

# 视图函数
def view(request):
  if request.method=='POST':
 		...
    return HttpResponse({'name':'jason','age':20})
  return render(request,'view.home')

ajax的回调函数会接受到bytes类型的数据,需要自己在回调函数中进行序列化

$.ajax({
  url:'',
  type:'',
  data:{'xxx':'xxx'}
  success:function (args) {  // 参数为获取后端返回的值
    // 回调函数
    console.log(args)
    let a=JSON.parse(args)  // 反序列化
  }
})

也可以加一个参数自动进行反序列化:

dataType:JSON

JsonResponse

数据传入回调函数中会被ajax自动进行反序列化。

序列化

定义

我们通过ORM获取到的结果集其实就是一个个用户对象,但当我们要将此数据以json格式发送给客户端的时候,就可以用Django给我们提供的序列化方式。

语法

from django.http import JsonResponse
def ajax(request):
    if request.method=='POST':
      	# 获取书籍表的全部用户对象
        book_list=models.Book.objects.all()
        # 导入内置序列化模版
        from django.core import serializers
        # 调用该模块的serialize方法
        book_dict=serializers.serialize('json',book_list)
        print(book_dict)
        return JsonResponse(book_dict,safe=False)

    return render(request,'a_ajax.html')
posted @ 2022-09-07 19:16  荀飞  阅读(48)  评论(0编辑  收藏  举报