django ajax
Ajax
不是新的编程语言，而是一种使用现有标准的新方法
ajax最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据
并更新部分页面内容（异步提交，局部刷新）
朝后端发送请求的方式：
浏览器地址栏输入url
a便签href属性
form表单
ajax
我们学的是jQuery版本的ajax，所以你必须要确保html页面已经提前加载了jQuery
ajax基本语法
1指定朝那个后端发送ajax请求
2请求方式
3数据
4回调函数：当后端给你返回结果的时候会自动触发 args接受后端返回结果
ajax( {
url : ' ',
type : ' get/post ',
data : { ' username ' : ' jason ' , ' password ' : 123 }
success : function (args) {
}
} )
当你在利用ajax进行前后端交互的时候
后端无论返回什么都只会被回调函数接受，最不会影响这个浏览页面
针对后端如果使用HTTPResponse返回的数据，回调函数不会帮你反序列化
如果后端是JSONResponse返回的数据，回调函数自动帮你反序列化
HTTPResponse解决方式
1自己在前端利用JSON.parse()
2在ajax里面配置一个参数
前后端传输数据编码格式( contentType)
可以朝后端发送post请求的方式
1form表单
2ajax请求
前后端传输数据的编码格式
urlencoded
formdata
json
form表单
默认的数据编码格式是urlencoded
数据格式：username=Jason&password=123
django后端针对符合urlencoded编码格式的数据都会自动帮你解析封装到request.POST中
如果你把编码格式改为formdata，那么针对普通的键值对还是解析到request.POST中
而文件解析到request.FILES中
form表单是没办法发送json格式数据的
ajax
默认编码方式也是urlencoded
Ajax发送json格式数据
前后端传输数据的时候一定要确保编码格式跟数据真正的数据是一致的
$.ajax( {
url : ' ' ,
type : ' ' ,
data : JSON.stringify( { 'username' : 'jason' , 'password':123 } )
dataTypr : 'JSON',
contentType : 'application/json',
success : function ( args ){ }
})
django针对json格式数据不会做任何的处理
json_byes = request.body
json_str = json_bytes.decode( 'utf-8' )
json_dict = json.loads(json_str)
json.loads括号内传入了一个二进制格式的数据那么内部自动解码最反序列化
json.dict = json.loads(json_byes)
ajax发送json格式数据需要注意的点
1contentType参数指定成:application/json
2数据时真正的json格式数据
3django后端不会帮你处理Jason格式数据，需要你自己去request.body获取并处理
Ajax发送文件
ajax发送文件需要借助于js内置对象FormData
$( '#d4' ) .on( ' click ' , function ( ) {
//1需要先利用FormData内置对象
let formDataObj = new FormData( );
// 2添加普通键值对
formDataObj.append( 'username' , $('#d1').val( ) );
formDataObj.append( 'password' , $('#d2').val( ) );
//3添加文件对象
formDataObj.append( 'myfile' , $('#d3')[ 0 ] . files[ 0 ] )
//4将对象基于ajax发送给后端
$.ajax( {
url : ' ',
type : ' post ',
data : formDataObj,
//ajax发送文件必须指定的两个参数
contentType : false,
processData : false,
success : function ( args ) {
}
} )
总结：
1需要利用内置对象FormData
2需要指定两个关键性的参数
3django后端能够直接识别到formdata对象并且能将内部的普通键值自动解析
并封装到request.POST中，文件数据自动解析并封装到request.FILES中
django自带的序列化组件
前后端分离的项目
作为后端开发的你只需要写代码将数据处理好，能够序列化返回给前端即可
最写一个借口文档，告诉前端每个字段代表的意思即可
写接口就是利用序列化组件渲染数据然后写一个接口文档，该交代的交代一下
到了工作中之后，大部分的项目都是前后端分离的
也就意味着我们无法直接使用django提供的模板语法来实现前后端数据交互
所以这个时候我们需要将数据处理成大家公共的都能处理的格式(json格式)
一般情况下都是处理成列表套字典的形式
由于针对数据的封装有时候会非常繁琐，所以有现成的模块可以直接完成
1django内置的模块
2第三方模块：django restframework
Ajax结合sweetalert实现删除按钮的二次确应
前后端在用ajax进行数据交互的时候
后端通常给ajax的回调函数返回一个字典格式的数据
1lowb版本，直接刷新当前页面
window.location.reload( )
2利用DOM操作，动态刷新
currentBtn.parent( ).parent( ).remove( )
