Django - Ajax - 参数

一、Jquery实现Ajax

url type data success error complete statusCode

{% load staticfiles %}<!DOCTYPE html><html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script src="{% static 'JS/jquery-3.1.1.js' %}"></script>
</head>
<body><button class="send_Ajax">send_Ajax</button><script>//$.ajax的两种使用方式://$.ajax(settings);//$.ajax(url,[settings]);
$(".send_Ajax").click(function(){$.ajax({url:"/handle_Ajax/",type:"POST",data:{username:"Yuan",password:123},success:function(data){alert(data)},//=================== error============
error: function (jqXHR, textStatus, err) {// jqXHR: jQuery增强的xhr// textStatus: 请求完成状态// err: 底层通过throw抛出的异常对象，值与错误类型有关
                        console.log(arguments);},//=================== complete============
complete: function (jqXHR, textStatus) {// jqXHR: jQuery增强的xhr// textStatus: 请求完成状态 success | error
                    console.log('statusCode: %d, statusText: %s', jqXHR.status, jqXHR.statusText);console.log('textStatus: %s', textStatus);},//=================== statusCode============
                statusCode: {'403': function (jqXHR, textStatus, err) {console.log(arguments);  //注意：后端模拟errror方式：HttpResponse.status_code=500
                     },'400': function () {}}})})</script>
</body>
</html>

import json,timedef index(request):return render(request,"index.html")def handle_Ajax(request):username=request.POST.get("username")password=request.POST.get("password")print(username,password)time.sleep(10)return HttpResponse(json.dumps("Error Data!"))

二、$.ajax参数

请求参数：

######################------------data---------################
data: 当前ajax请求要携带的数据，是一个json的object对象，ajax方法就会默认地把它编码成某种格式(urlencoded:?a=1&b=2)发送给服务端；此外，ajax默认以get方式发送请求。function testData() {$.ajax("/test",{     //此时的data是一个json形式的对象data:{a:1,b:2}});                   //?a=1&b=2
######################------------processData---------################

processData：声明当前的data数据是否进行转码或预处理，默认为true，即预处理；if为false，那么对data：{a:1,b:2}会调用json对象的toString()方法，即{a:1,b:2}.toString(),最后得到一个［object，Object］形式的结果。######################------------contentType---------################

contentType：默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型。用来指明当前请求的数据编码格式；urlencoded:?a=1&b=2；如果想以其他方式提交数据，比如contentType:"application/json"，即向服务器发送一个json字符串：$.ajax("/ajax_get",{data:JSON.stringify({a:22,b:33}),contentType:"application/json",type:"POST",});                          //{a: 22, b: 33}注意：contentType:"application/json"一旦设定，data必须是json字符串，不能是json对象views.py:   json.loads(request.body.decode("utf8"))######################------------traditional---------################

traditional：一般是我们的data数据有数组时会用到 ：data:{a:22,b:33,c:["x","y"]},traditional为false会对数据进行深层次迭代；

响应参数：

dataType：  预期服务器返回的数据类型,服务器端返回的数据会根据这个值解析后，传递给回调函数。默认不需要显性指定这个属性，ajax会根据服务器返回的content Type来进行转换；比如我们的服务器响应的content Type为json格式，这时ajax方法就会对响应的内容进行一个json格式的转换，if转换成功，我们在success的回调函数里就会得到一个json格式的对象；转换失败就会触发error这个回调函数。如果我们明确地指定目标类型，就可以使用data Type。dataType的可用值：html｜xml｜json｜text｜script见下dataType实例

from django.shortcuts import render,HttpResponse
from django.views.decorators.csrf import csrf_exempt
# Create your views here.import jsondef login(request):return render(request,'Ajax.html')def ajax_get(request):l=['alex','little alex']dic={"name":"alex","pwd":123}#return HttpResponse(l)      #元素直接转成字符串alexlittle alex#return HttpResponse(dic)    #字典的键直接转成字符串namepwdreturn HttpResponse(json.dumps(l))return HttpResponse(json.dumps(dic))# 传到前端的是json字符串,要想使用,需要JSON.parse(data)//---------------------------------------------------function testData() {$.ajax('ajax_get', {success: function (data) {console.log(data);console.log(typeof(data));//console.log(data.name);//JSON.parse(data);//console.log(data.name);},//dataType:"json",})}注解:Response Headers的content Type为text/html,所以返回的是String;但如果我们想要一个json对象设定dataType:"json"即可,相当于告诉ajax方法把服务器返回的数据转成json对象发送到前端.结果为object当然，return HttpResponse(json.dumps(a),content_type="application/json")这样就不需要设定dataType:"json"了。content_type="application/json"和content_type="json"是一样的！

三、csrf跨站请求伪造

$.ajaxSetup({

　　data: {csrfmiddlewaretoken: '{{ csrf_token }}' },

});

<form>

{% csrf_token %}

</form>

<br><br><br>

$.ajax({<br>...<br>data:{"csrfmiddlewaretoken":$("[name='csrfmiddlewaretoken']").val();}<br>})

<script src="{% static 'js/jquery.cookie.js' %}"></script>

$.ajax({

　　headers:{"X-CSRFToken":$.cookie('csrftoken')},

})

https://www.cnblogs.com/yuanchenqi/articles/7638956.html

四、示例

要掌握的 //js: 字符串 数组 object{}

编码方式：    url-encode  form-data   application/json

form / ajax  1.默认: Content-Type: application/x-www-form-urlencoded,  请求体中： user=yuan&pwd=123  request.POST:  post: <QueryDict: {'user': ['yuan'], 'pwd': ['123']}>

 2.上传文件：enctype="multipart/form-data" formdate = new FormData(); 请求体中： ------WebKitFormBoundaryFTMqfCmRXmFBlfK4 Content-Disposition: form-data; name="user"

 yuan ------WebKitFormBoundaryFTMqfCmRXmFBlfK4 Content-Disposition: form-data; name="pwd"

 123 ------WebKitFormBoundaryFTMqfCmRXmFBlfK4--

 3.contentType:'application/json',  请求体中： {"a":1,"b":2} 接收数据： request.POST，request.GET 收不到数据！！ request.body，才能收到！！  dic = json.loads(request.body.decode('utf-8'))

 为什么？ request.body 源数据都在这里 body: b'{"a":1,"b":2}'

 django: wsgi 只对 url-encode 转，因此：request.POST 才能拿到数据！ 对于json，wsgi不转，需要我们从body中拿数据。

参数：

<script src="/static/js/jquery.cookie.js"></script>

headers:{"X-CSRFToken":$.cookie('csrftoken')},contentType:'application/json',      dataType:'json',  # 拿到数据后，json解析数据，若没有，就是str 

success:function (data) {}error:function (data) {}finally:function (data) {}

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><form action="" method="post">{% csrf_token %}<input type="text" name="user"><input type="text" name="pwd"><input type="submit">
</form><hr><button class="btn">click</button><script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="/static/js/jquery.cookie.js"></script>
<script type="text/javascript">$('.btn').click(function () {$.ajax({headers:{"X-CSRFToken":$.cookie('csrftoken')},url:'/test/',type:'POST',contentType:'application/json',data:JSON.stringify({a:1,b:2,'csrfmiddlewaretoken':$("[name='csrfmiddlewaretoken']").val()}),dataType:'json',success:function (data) {  // json 字符串 。。。
                console.log(data);console.log(typeof data)},error:function (data) {console.log('error',data)},finally:function (data) {console.log('finally',data)}})});</script></body>
</html>

def test(request):if request.method == 'POST':print("post:",request.POST)print("get:",request.GET)print("files:",request.FILES)print("body:",request.body)import jsondic = json.loads(request.body.decode('utf-8'))print(dic['a'])print(dic)# return HttpResponse('OK')
info = {'name':'alex'}return HttpResponse(json.dumps(info))# return HttpResponse("{'name':'alex'}")return render(request,'test.html')

转载于:https://www.cnblogs.com/alice-bj/p/9191082.html

Django - Ajax - 参数相关推荐

Django Ajax总结
Django Ajax总结 Ajax-Jquery ajax 配合 json 使用BookStrap进行前端框架开发 font-awesome 图标插件 Ajax全套发送请求 1.使用JQuery调 ...
Django——Ajax
Ajax准备知识:json 什么是json? 定义: JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式.它基于 ECMAScript (w ...
Jquery中AJAX参数详细介绍
转载:http://www.cnblogs.com/qiufuwu618/archive/2012/12/20/2826190.html Jquery中AJAX参数详细列表: 参数名类型描述 ur ...
jquery中ajax中的参数,jquery中的ajax参数
jquery中将ajax封装成了函数,我们使用起来非常方便,jquery会自动根据内容选择post还是get方式提交数据,并且会自动编码,但是要想完全掌握jquery中的ajax,我们必须将它的各个参 ...
Jquery中AJAX参数详细列表
下面是jQuery中AJAX参数详细列表: 参数名类型描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求 ...
Ajax参数对照及Success内容
本文是好久之前参考网上大佬教程,边学习边参考边做笔记,整理的内容,分享下大家学习~ 如果这位大佬看见,请评论留下您的名字和博客地址,我这里修改为[转载] Ajax参数 jQuery 拥有完整的 Aja ...
ajax防止csrf,django ajax提交避免csrf_toke错误
将以下代码写入到csrf_token_new.js,然后在html页面中加入该js,即可避免出现csrt错误 /*====================django ajax ======*/jQu ...
django ajax请求 csrf验证失败
如何解决django ajax请求 csrf验证失败的问题: 原文链接:http://stackoverflow.com/questions/5100539/django-csrf-check-fai ...
django ajax传参数
获取参数: param= json.loads(request.body.decode('utf-8')) # file_name= param["filename"] 传递参数: ...

Django - Ajax - 参数

一、Jquery实现Ajax

二、$.ajax参数

三、csrf跨站请求伪造

四、示例

Django - Ajax - 参数相关推荐

最新文章

热门文章