一 ajax介绍
-
异步 Javascript 和 XML:
-异步:跟同步是对应的
-javascript:通过javascript来操作,发送请求 ,到服务端
-xml:数据交互使用xml,现在主流使用json格式
-xml:可阅读性比较高,解析复杂,占的空间大
lqz
19
-json:可阅读性比较高,解析简单,占的空间小
{“name”:“lqz”,“age”:19}
-浏览器页面局部刷新(js的dom操作)-通过js发送http的请求(go,java,php,requset)
-
同步和异步
-
IAAS,PAAS,SAAS
-
同步交互和异步交互
同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才能发出第二个请求。
异步交互:客户端发出一个请求后,无需等待服务器响应结束,就可以发出第二个请求。
二 ajax的简单使用
-
原生js写ajax请求(写起来很复杂,而且需要考虑浏览器版本)
-
jquery帮咱们封装好了一个方法 ajax,我们直接调用jquery的方法,就可以发送ajax的请求
-
后期,前后端分离了,还可以继续使用jquery的ajax, axios更主流一些
-
现在我们学的jquery的ajax方法的使用
-
需求:通过Ajax,实现前端输入两个数字,服务器做加法,返回到前端页面
-
模板
$.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
三 ajax上传文件
-
http请求,body体中放文件内容,ajax本质就是发送http请求,所以它可以上传文件
-
两种上传文件的方式,form表单,ajax
-
固定模板
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) } })
四 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)
}
})
五 django内置序列化器(了解,不好用,后面有更好的)
- 把对象转成json格式,json.dumps实现不了,
- 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)