• django框架之Ajax提交数据等相关内容-71


    1 ajax介绍

    # 1 异步 Javascript 和 XML:
    -异步:跟同步是对应的  
       -javascript:通过javascript来操作,发送请求 ,到服务端
       -xml:数据交互使用xml,现在主流使用json格式
       -xml:可阅读性比较高,解析复杂,占的空间大
           <name>lqz</name>
           <age>19</age>
       -json:可阅读性比较高,解析简单,占的空间小
      {"name":"lqz","age":19}
    -浏览器页面局部刷新(js的dom操作)
       
       -通过js发送http的请求(go,java,php,requset)
       
    # 2 同步和异步

    #3 IAAS,PAAS,SAAS

    # 4 同步交互和异步交互
       同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才能发出第二个请求;
       异步交互:客户端发出一个请求后,无需等待服务器响应结束,就可以发出第二个请求。

    2 ajax的简单使用

    1 原生js写ajax请求(写起来很复杂,而且需要考虑浏览器版本)
    2 jquery帮咱们封装好了一个方法 ajax,我们直接调用jquery的方法,就可以发送ajax的请求
    3 后期,前后端分离了,还可以继续使用jquery的ajax, axios更主流一些
    4 现在我们学的jquery的ajax方法的使用


    5 需求:通过Ajax,实现前端输入两个数字,服务器做加法,返回到前端页面

    6 模板
       $.ajax({
           url: '/add/',  
           method: 'post',
           data:{'a':$("#first").val() ,'b':$("#second").val() },
           success:function (data) {
               //成功触发
          },
           error:function (error) {
               //失败,触发
          }
      })
       
       
       # 默认清空下ajax会把{'a':$("#first").val() ,'b':$("#second").val() }数据转成
       # 预处理数据
       a=20&b=30,放到body体中
       # 编码默认用urlencoded

    3 ajax上传文件

    1 http请求,body体中放文件内容,ajax本质就是发送http请求,所以它可以上传文件
    2 两种上传文件的方式,form表单,ajax

    3 固定模板
       var formdata=new FormData()
       formdata.append('myfile',$("#id_file")[0].files[0])
       # 还可以带数据
       $.ajax({
               url:'/uploadfile/',
               method: 'post',
               //上传文件必须写这两句话
               processData:false,  # 预处理数据,
               contentType:false,  # 不指定编码,如果不写contentType,默认用urlencoded
               data:formdata,      # formdata内部指定了编码,并且自行处理数据
               success:function (data) {  
                   console.log(data)
              }
          })

    4 ajax提交json格式

    $.ajax({
               url:'/uploajson/',  //写全,是什么样就写什么样
               method:'post',
               contentType: 'application/json',
               //data要是json格式字符串
               //data:'{"name":"","password":""}',
               //把字典转成json格式字符串
               //JSON.stringify(dic)
               //把json格式字符串转成对象
               //JSON.parse(data)
               data:JSON.stringify({name:$("#id_name1").val(),password:$("#id_password1").val()}),
               success:function (data) {
                   //返回字符串类型,需要转成js的对象,字典

                   //1 如果:django 返回的是HttpResponse,data是json格式字符串,需要自行转成字典
                   //2 如果:django 返回的是JsonResponse,data是就是字典
                   //ajax这个方法做的是,如果响应数据是json格式,自动反序列化
                   console.log(typeof data)
                   var res=JSON.parse(data)
                   console.log(typeof res)
                   console.log(res.status)
                   console.log(res.msg)


              }
          })

    5 django内置序列化器(了解,不好用,后面有更好的)

    1 把对象转成json格式,json.dumps实现不了,
    2 django内置了一个东西,可以把对象转成json格式
    from django.core import serializers
    book_list = Book.objects.all()    
    ret = serializers.serialize("json", book_list)  # ret就是json格式字符串


    ll=[]
    for book in book_list:
       ll.append({'name':book.name,'price':book.pirce})  
    import json
    ret=json.dumps(ll)


    return HttpResponse(ret)
  • 相关阅读:
    vulnhub靶场 之 DC -1
    PHP反序列化中过滤函数使用不当导致的对象注入
    网络内生安全试验场-CTF答题夺旗赛(第四季)web知识
    BUUCTF 随便注
    SWPUCTF 2019 web
    春秋-SQLi题
    i春秋-“百度杯”CTF比赛 十月场-Login
    i春秋-第三届“百越杯”福建省高校网络空间安全大赛-Do you know upload?
    i春秋CTF-“百度杯”CTF比赛 九月场 XSS平台
    终于等到你,最强 IDE Visual Studio 2017 正式版发布
  • 原文地址:https://www.cnblogs.com/usherwang/p/14119727.html
Copyright © 2020-2023  润新知