ajax后台如何把对象转为json_57. Django 2.1.7 查询数据返回json格式
需求問題
在日常工作中，對于前端發(fā)送過來的請求，后端django大部分都是采用json格式返回，也有采用模板返回視圖的方式。
在模板返回視圖的方式的確很方便，但是如果涉及到動靜分離、ajax請求這類，django就只能返回json格式的數(shù)據(jù)了。
那么這里就帶來了一個問題，如何將django從數(shù)據(jù)庫模型類中查詢的數(shù)據(jù)以json格式放回前端。
然后前端如果獲取讀取返回過來的數(shù)據(jù)呢？
環(huán)境說明
- 前端采用jquery發(fā)送ajax請求
- python 3.7.2
- django 2.1.7
示例說明
這次示例首先寫一個簡單的頁面發(fā)送ajax請求，然后后端分如何返回多行數(shù)據(jù)，如果返回查詢對象進(jìn)行示例說明。
前端代碼
首先編寫一個簡單的前端頁面test_ajax.html如下：
span style="color: #9B9B9B;line-height: 26px;">html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Titletitle>
<script src="/static/js/jquery-3.0.0.min.js">script>
<script>
$(function () {
$('#search_server').click(function () {// 獲取服務(wù)器名稱var server_name = $('#server_name').val();console.log('server_name = ' + server_name);// 發(fā)送ajax post請求
$.ajax({url: "/assetinfo/test_ajax",type: 'POST',data: {"tag": "search_project","server_name": server_name,
},dataType: "json",async: false,// 請求成功調(diào)用的函數(shù)success: function (data) {console.log(data);
},// 請求出錯時調(diào)用的函數(shù)error: function () {
alert("查詢項(xiàng)目數(shù)據(jù)發(fā)送失敗");
}
})
})
})script>
head>
<body>
<input type="text" id="server_name">
<button id="search_server">提交button>
body>
html>
實(shí)現(xiàn)的功能很簡單，只是獲取輸入框的內(nèi)容，然后點(diǎn)擊提交按鈕發(fā)送一個ajax的post請求即可。
后臺直接查詢服務(wù)器信息，然后返回多條json數(shù)據(jù)
實(shí)現(xiàn)類視圖代碼如下：
from django.core import serializersfrom django.http import HttpResponse
from assetinfo.models import ServerInfo
# ex: /assetinfo/test_ajax
class TestAjax(View):
def get(self,request):
"""顯示html頁面"""
return render(request,'assetinfo/test_ajax.html')
def post(self,request):
"""接收處理ajax的post請求"""
servers = ServerInfo.objects.all() # 查詢服務(wù)器信息
json_data = serializers.serialize('json', servers) # 將查詢結(jié)果進(jìn)行json序列化
return HttpResponse(json_data, content_type="application/json") # 返回json數(shù)據(jù)
在后臺代碼我沒有做獲取post請求的參數(shù)，再進(jìn)行的參數(shù)查詢的操作，這樣只演示如何返回json格式數(shù)據(jù)。
其中獲取post請求參數(shù)的方式很簡單，依然是request.POST.get('參數(shù)名')即可。
?瀏覽器測試功能如下：
”可以從瀏覽器的控制臺看到后端返回過來的結(jié)果數(shù)據(jù)。
但是這樣直接返回跟前端沒有任務(wù)約束是不好的，那么下面來增加一下與前端交互的格式約束。
前后端約束返回數(shù)據(jù)格式
{"resCode": '0', "message": 'success',"data": []}按照這個約束格式，那么查詢的結(jié)果應(yīng)該放在data的數(shù)組中。下面來改后端視圖代碼。
后端按照約束格式返回json數(shù)據(jù)
from django.core import serializersfrom django.http.response import JsonResponse
from assetinfo.models import ServerInfo
# ex: /assetinfo/test_ajax
class TestAjax(View):
def get(self,request):
"""顯示html頁面"""
return render(request,'assetinfo/test_ajax.html')
def post(self,request):
"""接收處理ajax的post請求"""
# 和前端約定的返回格式
result = {"resCode": '0', "message": 'success',"data": []}
# 查詢服務(wù)器信息
servers = ServerInfo.objects.all()
# 序列化為 Python 對象
result["data"] = serializers.serialize('python', servers)
return JsonResponse(result)
?
瀏覽器測試如下：
”這樣子返回前端的話，每條數(shù)據(jù)對象包含 fields，model，pk三個對象，分別代表字段、模型、主鍵，我更想要一個只包含所有字段的字典對象。
后端修改每個model對象轉(zhuǎn)化為dict字典對象
from django.core import serializersfrom django.http.response import JsonResponse
from django.forms.models import model_to_dict
# ex: /assetinfo/test_ajax
class TestAjax(View):
def get(self,request):
"""顯示html頁面"""
return render(request,'assetinfo/test_ajax.html')
def post(self,request):
"""接收處理ajax的post請求"""
# 和前端約定的返回格式
result = {"resCode": '0', "message": 'success',"data": []}
# 查詢服務(wù)器信息
servers = ServerInfo.objects.all()
# 將model對象逐個轉(zhuǎn)為dict字典，然后設(shè)置到data的list中
for server in servers:
server = model_to_dict(server) # model對象轉(zhuǎn)dict字典
server['server_used_type_id'] = serializers.serialize('python', server['server_used_type_id']) # 外鍵模型對象需要序列化，或者去除不傳遞
result["data"].append(server)
return JsonResponse(result)
?
瀏覽器測試如下：
”可以看到，這樣傳遞給前端就是字典對象了。
最后，再給出前端js遍歷json格式數(shù)據(jù)的示例。
前端遍歷返回的json格式數(shù)據(jù)示例
總結(jié)
以上是生活随笔為你收集整理的ajax后台如何把对象转为json_57. Django 2.1.7 查询数据返回json格式的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： ps怎么制作流体_PS教程：制作渐变流体
- 下一篇： psm倾向得分匹配法举例_互助问答第11