首页 > Web开发 > 详细

前端contentType数据传输格式与ajax技术

时间:2019-06-18 09:09:20      阅读:105      评论:0      收藏:0      [点我收藏+]
    前端数据格式contentType参数
        前后端传输数据的编码格式
            1.urlencoded(form表单与ajax默认的数据提交编码格式)  
                数据格式 name=jason&password=123
                django后端识别到urlencoded数据格式将其处理封装到了request.POST
            2.formdata  传输文件
                支持传普通键值对也可以传文件
                普通键值还是处理放到request.POST中
                文件数据处理放到request.FILES中
            3.application/json(ajax支持)
                JSON.stringify({name:jason})
                django后端对于json格式的数据不做任何处理,就将原生的二进制数据存在request.body中,让你自己手动处理
                    先解码再反序列化
            
    局部刷新之ajax
        异步提交(github注册示例)
        局部刷新
        
        四个基本参数
            url:‘‘,  # 控制数据提交的地址,不写默认往当前位置提交
            type:get,  # 控制的是数据的提交方式 get,post,。。。
            data:{name:jason}  # 提交的数据
            success:function(data){
                # 做局部刷新的操作
                alert(data)
            }
        
        $(#b1).click(function(){
            $.ajax({
                url:‘‘,  # 控制数据提交的地址,不写默认往当前位置提交
                type:get,  # 控制的是数据的提交方式 get,post,。。。
                contentType:application/json,
                data:JSON.stringify({name:jason}),  # 提交的数据
                success:function(data){
                    # 做局部刷新的操作
                    alert(data)
                }
            })
        
        
        })
        
        ajax发送文件
            1.利用一个js内置对象FormData
            2.这个FormData即可以传普通的键值也可以传文件
            3.需要修改两个默认参数processData,contentType
            4.获取input框存储的文件数据$(input[type="file"])[0].files[0]
        
        $(#b1).click(function(){
            # 先生成一个内置对象
            var formdata = new FormData();
            formdata.append(,);
            formdata.append(myfile,$(input[type="file"])[0].files[0]);
            $.ajax({
                url:‘‘,  # 控制数据提交的地址,不写默认往当前位置提交
                type:get,  # 控制的是数据的提交方式 get,post,。。。
                contentType:false,
                processData:false,
                data:JSON.stringify({name:jason}),  # 提交的数据
                success:function(data){
                    # 做局部刷新的操作
                    alert(data)
                }
            })
        
        
        })

 

前端contentType数据传输格式与ajax技术

原文:https://www.cnblogs.com/dongxixi/p/11042888.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!