Ajax contentType - 爱码网

一.什么是Ajax

AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互
Ajax是js中的技术,但原生的js操作Ajax比较复杂,我们这里为了提高效率,直接使用jQuery封装版本的Ajax

二.优点

1.Ajax向服务器发送异步请求
2.Ajax请求无序刷新整个页面(局部刷新)
3.因为服务器响应内容不再是整个页面,而是页面的局部内容没所以Ajax性能高
'''局部刷新,异步请求'''

三.如何使用

/*基本参数:*/
1.url : 提交的地址
2.type : 提交的方式(默认GET)
3.data : 提交的数据
4.success : 回调函数(因为是异步提交,需要回调函数,取结果)

/*基本语法:*/ Ajax通常与事件绑定使用
$('#d1').click(function() {
    $.ajax({
        url:'/index/',  // 提交的地址
        type:'post',  // 提交的方式
        data:{'name':'xionger', 'password':'123'}  // 提交的数据
        success:function(data) {
            alert(data)  // data接收的就是异步提交返回的结果
    }  
    })
})

求和实例:

<!--前端-->
<body>
<input type="text" id="id1"> + <input type="text" id="id2"> = <input type="text" id="id3">
<button id="b1">求和</button>

<script>
    $('#b1').click(function () {
        $.ajax({
            url:'',
            type:'post',
            data:{'id1':$('#id1').val(),'id2':$('#id2').val()},
            success:function (data) {
                // {alert(data)}   data形参用来接收异步提交的结果
                $('#id3').val(data)  // 通过DOM操作,将结果渲染到第三个input框中
            }
        })
    })
</script>
</body>

# 后端
def index(request):
    if request.is_ajax():  # 判断是否是Ajax
        if request.method == 'POST':  # POST 方式请求的数据都在POST中
            id1 = request.POST.get('id1')
            id2 = request.POST.get('id2')
            # 数据传输过来d都是字符串,强转整型
            id1 = int(id1)
            id2 = int(id2)
            res = id1 + id2
            # 将结果返回到前端
            return HttpResponse(res)
    return render(request, 'index.html')

contentType

一.前后端传输数据编码格式

1.urlencoded  # form表单与Ajax默认的数据编码格式
2.formdata  # form表单
3. json  # Ajax
ps: Ajax传输文件建议使用内置对象: new Formdata()
'''注意:前后端传输数据的时候,一定要保证数据格式和你的编码格式是一致的'''

1.urlencoded

1.数据格式: name=xionger&password=123
2.Django后端针对urlencoded编码格式的数据会自动解析并放到 request.POST 中.
3.form表单与Ajax默认的数据编码格式

2.formdata

1.form表单传输文件的编码格式
2.Django后端针对form表单指定formdata格式传输文件就会自动解析并将文件放到request.FILES中
3.使用:<form action="" method="post" enctype="multipart/form-data">

3.json

1.Ajax发送json格式数据
2.Django后端针对json格式的数据,并不会自动解析放到request.POST或者request.FILES里面,
　　它并不会解析json格式数据,而是将它原封不动的放在request.body中
3.使用:data:JSOM.stringify({'name':'xionger', 'password':123})
ps:JSOM.stringify() 类似 json.dumps()

前后端传输数据的编码方式
    1.urlencoded      >>>    name=jason&pwd=123&hobby=read
    2.formdata      >>>    传文件也支持传普通键值(name=jason&pwd=123&hobby=read)
    3.application/json  >>>        json格式数据(form表单是无法发送json格式数据的)
            
form,ajax默认的是urlencoded
            
django后端针对不同的编码格式是如何处理的?
    只要是符合urlencoded编码格式  都会被后端自动获取并解析放到request.POST中
    如果是符合formdata那么文件会自动被解析放到request.FILES中
如果是json格式 后端默认不解析 以二进制的形式就放在request.body你可以自己手动处理即可

contentType总结