?

?示例1：

js:

function SaveAction(){//點擊 保存按鍵var senddata = {"type":"A", "host":"www", "resolution_line":"0", "data":"172.16.2.3", "mx":"5", "ttl":"600"}$.ajax({url: "/dns/add.html",type: "POST", //請求類型data: {"data":senddata},dataType: "json", // 這里指定了 dateType 為json后，服務端響應的內容為json.dumps(date)，下面 success 的callback 數據無需進行JSON.parse(callback)，已經是一個對象了，如果沒有指定dateType則需要執行 JSON.parse(callback)success: function (callback) {//當請求執行完成后，自動調用//callback, 服務器返回的數據 console.log(callback);},error: function () {//當請求錯誤之后，自動調用 }}); }

?

?

?

django 后臺 view:

?

def record_add(req):"""添加解析記錄:param req::return:"""if req.method == 'POST':type = req.POST.get('data[type]')host = req.POST.get('data[host]')resolution_line = req.POST.get('data[resolution_line]')data = req.POST.get('data[data]')mx = req.POST.get('data[mx]')ttl = req.POST.get('data[ttl]')print(type, host, resolution_line, data, mx, ttl)return HttpResponse('hehe')else:return HttpResponse('use POST request method please.')

?

?

示例2：

JS

?

function SaveAction(){//點擊 保存按鍵var _type = $(".modal-body select[name=type]").val();var _host = $(".modal-body input[name=host]").val();var _resolution_line = $(".modal-body select[name=resolution_line]").val();var _data = $(".modal-body input[name=data]").val();var _mx = $(".modal-body input[name=mx]").val();var _ttl = $(".modal-body select[name=ttl]").val();var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }$.ajax({url: "/dns/add.html",type: "POST", //請求類型//contentType: "application/json; charset=utf-8", data: senddata,dataType: "json",success: function (callback) {//當請求執行完成后，自動調用//arg, 服務器返回的數據 console.log(callback);},error: function () {//當請求錯誤之后，自動調用 }}); }

?

?

?

?

?

django view

def record_add(req):"""添加解析記錄:param req::return:"""if req.method == 'POST':type = req.POST.get('type')host = req.POST.get('host')resolution_line = req.POST.get('resolution_line')data = req.POST.get('data')mx = req.POST.get('mx')ttl = req.POST.get('ttl')print(type, host, resolution_line, data, mx, ttl)return HttpResponse('hehe')else:return HttpResponse('use POST request method please.')

?

?

?

示例3：?

js

function SaveAction(){//點擊 保存按鍵var _type = $(".modal-body select[name=type]").val();var _host = $(".modal-body input[name=host]").val();var _resolution_line = $(".modal-body select[name=resolution_line]").val();var _data = $(".modal-body input[name=data]").val();var _mx = $(".modal-body input[name=mx]").val();var _ttl = $(".modal-body select[name=ttl]").val();var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }$.post("/dns/add.html", {'data':JSON.stringify(senddata)},function(callback){JSON.parse(callback);}); }

?

$.post 源碼：

jQuery.each( [ "get", "post" ], function( i, method ) {jQuery[ method ] = function( url, data, callback, type ) {// shift arguments if data argument was omittedif ( jQuery.isFunction( data ) ) {type = type || callback;callback = data;data = undefined;}return jQuery.ajax({url: url,type: method,dataType: type,data: data,success: callback});}; });

?

?

?

?

?

?

django view

def record_add(req):"""添加解析記錄:param req::return:"""if req.method == 'POST':data = req.POST.get('data') # str: {"type":"A","host":"www","resolution_line":"0","data":"172.16.2.3","mx":"5","ttl":"600"}data = json.loads(data) # 字典：{'resolution_line': '0', 'data': '172.16.2.3', 'host': 'www', 'mx': '5', 'ttl': '600', 'type': 'A'}return HttpResponse('hehe')else:return HttpResponse('use POST request method please.')

?

?

示例4

js $.ajax post提交 json數據

function SaveAction(){//點擊 保存按鍵var _type = $(".modal-body select[name=type]").val();var _host = $(".modal-body input[name=host]").val();var _resolution_line = $(".modal-body select[name=resolution_line]").val();var _data = $(".modal-body input[name=data]").val();var _mx = $(".modal-body input[name=mx]").val();var _ttl = $(".modal-body select[name=ttl]").val();var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }$.ajax({url: "/dns/add.html",type: "POST", //請求類型contentType: "application/json; charset=utf-8",data: JSON.stringify(senddata),dataType: "json",success: function (callback) {//當請求執行完成后，自動調用//arg, 服務器返回的數據 console.log(callback);},error: function () {//當請求錯誤之后，自動調用 }}); }

?

?

?

?

?

django view

import jsondef record_add(req):"""添加解析記錄:param req::return:"""if req.method == 'POST':body_data = req.body # 獲取http請求體數據print(body_data) # b'{"type":"A","host":"www","resolution_line":"0","data":"172.16.2.3","mx":"5","ttl":"600"}'print(type(body_data)) # <class 'bytes'>body_data_str = str(body_data, encoding="utf8") # bytes 轉 strdata = json.loads(body_data_str)print(data['type'])return HttpResponse('hehe')else:return HttpResponse('use POST request method please.')

?

示例5：

建議使用這種方式

js

function SaveAction(){//點擊 保存按鍵var _type = $(".modal-body select[name=type]").val();var _host = $(".modal-body input[name=host]").val();var _resolution_line = $(".modal-body select[name=resolution_line]").val();var _data = $(".modal-body input[name=data]").val();var _mx = $(".modal-body input[name=mx]").val();var _ttl = $(".modal-body select[name=ttl]").val();var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }$.ajax({url: "/dns/add.html",type: "POST", //請求類型data: {'data': JSON.stringify(senddata)},dataType: "json",success: function (callback) {//當請求執行完成后，自動調用//arg, 服務器返回的數據 console.log(callback);},error: function () {//當請求錯誤之后，自動調用 }});}

?

?

?js post提交源數據：

?

?

?django view

def record_add(req):"""添加解析記錄:param req::return:"""if req.method == 'POST':data = req.POST.get('data')print(type(data)) # <class 'str'>data = json.loads(data) # str json序列化return HttpResponse('hehe')else:return HttpResponse('use POST request method please.')

?

轉載于:https://www.cnblogs.com/linkenpark/p/7461709.html

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的django 使用Ajax方式POST JSON数据包的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。