Django2.1.7 查询数据返回json格式的实现


Posted in Python onDecember 29, 2020

需求问题

在日常工作中,对于前端发送过来的请求,后端django大部分都是采用json格式返回,也有采用模板返回视图的方式。

在模板返回视图的方式的确很方便,但是如果涉及到动静分离、ajax请求这类,django就只能返回json格式的数据了。

那么这里就带来了一个问题,如何将django从数据库模型类中查询的数据以json格式放回前端。

然后前端如果获取读取返回过来的数据呢?

环境说明

  • 前端采用jquery发送ajax请求
  • python 3.7.2
  • django 2.1.7

示例说明

这次示例首先写一个简单的页面发送ajax请求,然后后端分如何返回多行数据如果返回查询对象进行示例说明。

前端代码

首先编写一个简单的前端页面test_ajax.html如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script src="/static/js/jquery-3.0.0.min.js"></script>
  <script>
    $(function () {
      $('#search_server').click(function () {
        // 获取服务器名称
        var server_name = $('#server_name').val();
        console.log('server_name = ' + server_name);
 
        // 发送ajax post请求
        $.ajax({
          url: "/assetinfo/test_ajax",
          type: 'POST',
          data: {
            "tag": "search_project",
            "server_name": server_name,
          },
          dataType: "json",
          async: false,
          // 请求成功调用的函数
          success: function (data) {
            console.log(data);
          },
          // 请求出错时调用的函数
          error: function () {
            alert("查询项目数据发送失败");
          }
 
        })
      })
    })
  </script>
</head>
<body>
 
<input type="text" id="server_name">
<button id="search_server">提交</button>
 
 
</body>
</html>

实现的功能很简单,只是获取输入框的内容,然后点击提交按钮发送一个ajax的post请求即可。

后台直接查询服务器信息,然后返回多条json数据

实现类视图代码如下:

from django.core import serializers
from 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() # 查询服务器信息
    json_data = serializers.serialize('json', servers) # 将查询结果进行json序列化
    return HttpResponse(json_data, content_type="application/json") # 返回json数据

在后台代码我没有做获取post请求的参数,再进行的参数查询的操作,这样只演示如何返回json格式数据。

其中获取post请求参数的方式很简单,依然是request.POST.get('参数名')即可。

浏览器测试功能如下:

Django2.1.7 查询数据返回json格式的实现

可以从浏览器的控制台看到后端返回过来的结果数据。

但是这样直接返回跟前端没有任务约束是不好的,那么下面来增加一下与前端交互的格式约束。

前后端约束返回数据格式

{"resCode": '0', "message": 'success',"data": []}

按照这个约束格式,那么查询的结果应该放在data的数组中。下面来改后端视图代码。

后端按照约束格式返回json数据

from django.core import serializers
from 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": []}
 
    # 查询服务器信息
    servers = ServerInfo.objects.all()
 
    # 序列化为 Python 对象
    result["data"] = serializers.serialize('python', servers)
 
    return JsonResponse(result)

浏览器测试如下:

Django2.1.7 查询数据返回json格式的实现

这样子返回前端的话,每条数据对象包含 fields,model,pk三个对象,分别代表字段、模型、主键,我更想要一个只包含所有字段的字典对象。

后端修改每个model对象转化为dict字典对象

from django.core import serializers
from 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": []}
    # 查询服务器信息
    servers = ServerInfo.objects.all()
 
    # 将model对象逐个转为dict字典,然后设置到data的list中
    for server in servers:
      server = model_to_dict(server) # model对象转dict字典
      server['server_used_type_id'] = serializers.serialize('python', server['server_used_type_id']) # 外键模型对象需要序列化,或者去除不传递
      result["data"].append(server)
 
    return JsonResponse(result)

浏览器测试如下:

Django2.1.7 查询数据返回json格式的实现

可以看到,这样传递给前端就是字典对象了。

最后,再给出前端js遍历json格式数据的示例。

前端遍历返回的json格式数据示例

<script>
    $(function () {
      $('#search_server').click(function () {
        ....
 
        // 发送ajax post请求
        $.ajax({
          url: "/assetinfo/test_ajax",
          type: 'POST',
          data: {
            "tag": "search_project",
            "server_name": server_name,
          },
          dataType: "json",
          async: false,
          // 请求成功调用的函数
          success: function (res) {
            {#console.log(res.data);#}
            // 遍历data信息
            for(var i=0;i<res.data.length;i++){
              console.log(res.data[i]);
              console.log(res.data[i]['server_hostname']);
              console.log(res.data[i]['server_internet_ip']);
              console.log(res.data[i]['server_intranet_ip']);
            }
          },
          // 请求出错时调用的函数
          error: function () {
            alert("查询项目数据发送失败");
          }
 
        })
      })
    })
  </script>

浏览器显示如下:

Django2.1.7 查询数据返回json格式的实现

到此这篇关于Django2.1.7 查询数据返回json格式的实现的文章就介绍到这了,更多相关Django返回json格式内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Python 相关文章推荐
Python中zip()函数用法实例教程
Jul 31 Python
python使用Tkinter显示网络图片的方法
Apr 24 Python
python插入排序算法实例分析
Jul 03 Python
Python守护进程和脚本单例运行详解
Jan 06 Python
python实现的二叉树定义与遍历算法实例
Jun 30 Python
Python坐标线性插值应用实现
Nov 13 Python
节日快乐! Python画一棵圣诞树送给你
Dec 24 Python
python3获取文件中url内容并下载代码实例
Dec 27 Python
从0到1使用python开发一个半自动答题小程序的实现
May 12 Python
PyQt5 控件字体样式等设置的实现
May 13 Python
如何利用python进行时间序列分析
Aug 04 Python
python 进程池pool使用详解
Oct 15 Python
Python 获取异常(Exception)信息的几种方法
Dec 29 #Python
python 将html转换为pdf的几种方法
Dec 29 #Python
python实现ping命令小程序
Dec 28 #Python
如何用python 操作zookeeper
Dec 28 #Python
Pycharm在指定目录下生成文件和删除文件的实现
Dec 28 #Python
Python用Jira库来操作Jira
Dec 28 #Python
python性能测试工具locust的使用
Dec 28 #Python
You might like
法压式咖啡之制作法
2021/03/03 冲泡冲煮
PHP基础陷阱题(变量赋值)
2012/09/12 PHP
TP3.2批量上传文件或图片 同名冲突问题的解决方法
2017/08/01 PHP
php实现支持中文的文件下载功能示例
2017/08/30 PHP
Yii Framework框架开发微信公众平台示例
2020/04/26 PHP
javascript的switch用法注意事项分析
2015/02/02 Javascript
javascript实现uploadify上传格式以及个数限制
2015/11/23 Javascript
Bootstrap按钮下拉菜单组件详解
2016/05/10 Javascript
全面了解javascript三元运算符
2016/06/27 Javascript
AngularJs定制样式插入到ueditor中的问题小结
2016/08/01 Javascript
JS正则表达式验证账号、手机号、电话和邮箱是否合法
2017/03/08 Javascript
浅谈Angular路由复用策略
2017/10/04 Javascript
JavaScript 生成唯一ID的几种方式
2021/02/19 Javascript
python判断字符串是否包含子字符串的方法
2015/03/24 Python
Python字符串拼接的几种方法整理
2017/08/02 Python
python的unittest测试类代码实例
2017/12/07 Python
Python实现读取及写入csv文件的方法示例
2018/01/12 Python
Python批量提取PDF文件中文本的脚本
2018/03/14 Python
python设计微型小说网站(基于Django+Bootstrap框架)
2019/07/08 Python
python字符串常用方法及文件简单读写的操作方法
2020/03/04 Python
TensorFlow低版本代码自动升级为1.0版本
2021/02/20 Python
英国虚拟主机服务商:eUKhost
2016/08/16 全球购物
打造经典复古风格的品牌:Alice + Olivia(爱丽丝+奥利维亚)
2016/09/07 全球购物
西班牙品牌鞋子、服装和配饰在线商店:Esdemarca
2021/02/17 全球购物
造型师求职自荐信
2013/09/27 职场文书
医学专业毕业生个人求职信
2013/12/25 职场文书
体育专业个人求职信范文
2013/12/27 职场文书
医药学专业大学生职业生涯规划书论文
2014/01/21 职场文书
大学生优秀团员事迹材料
2014/01/30 职场文书
校长创先争优承诺书
2014/08/30 职场文书
村党支部对照检查材料思想汇报
2014/09/28 职场文书
公司员工离职证明书
2014/10/04 职场文书
2014小学数学教研组工作总结
2014/12/06 职场文书
python实战之90行代码写个猜数字游戏
2021/04/22 Python
关于Python中进度条的六个实用技巧分享
2022/04/05 Python
Python使用pyecharts控件绘制图表
2022/06/05 Python