专栏首页菲宇ajax与django采用json进行数据交互

ajax与django采用json进行数据交互

1新建django项目名为json_ajax,应用名为app,在templates模板中新建ajax.html文件

ajax.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax</title>
    {% load staticfiles %}
    <script type="text/javascript" src="{% static 'js/jquery-3.3.1.min.js' %}"></script>
</head>
<body>
<button id="send">发送</button>
<script>
    $("#send").click(function () {
        {#json数据#}
        var post_data={
            "name":"weihu",
        };

        $.ajax({
            url:"http://127.0.0.1:8000/ajax",
            type:"POST",
            {#发送json数据到服务器#}
            data:post_data,

            {#请求成功回调函数#}
            success:function (data) {
                alert(data)
                alert("请求成功")
            },
            {#请求失败回调函数#}
            error:function () {
                alert("服务器请求超时,请重试!")
            }

        });
    });
</script>
</body>
</html>

2.在settings配置文件中,注释

1

# 'django.middleware.csrf.CsrfViewMiddleware',

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]

3.在urls.py文件中,配置path路径

"""json_ajax URL Configuration

The `urlpatterns` list routes URLs to views. For more information please see:
    https://docs.djangoproject.com/en/2.0/topics/http/urls/
Examples:
Function views
    1. Add an import:  from my_app import views
    2. Add a URL to urlpatterns:  path('', views.home, name='home')
Class-based views
    1. Add an import:  from other_app.views import Home
    2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')
Including another URLconf
    1. Import the include() function: from django.urls import include, path
    2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
"""
from django.contrib import admin
from django.urls import path
from app import views


urlpatterns = [
    path('admin/', admin.site.urls),
    path('test',views.test),
    path('ajax',views.ajax),
]

4.在views.py中,实现逻辑代码

from django.shortcuts import render,HttpResponse
import json

def test(request):
    return render(request,'ajax.html')

def ajax(request):
    if request.method=="POST":
        name=request.POST.get('name')
        print("ok")
        status=1
        result="sucuss"
        return HttpResponse(json.dumps({
            "status":status,
            "result":result,
            "name":name
        }))

Django将数据库查询数据QuerySet转换成JSON格式

1.采用Django Model层,ORM技术 转换成JSON格式

1 def getdata(request):
2    # 使用ORM
3    # all()返回的是QuerySet 数据类型;values()返回的是ValuesQuerySet 数据类型
4    data = models.VM.objects.values('id', 'ip', 'host', 'username')
5    data = serializers.serialize("json", tomcats)
6    return JsonResponse(list(data), safe=False)

2.完全弃用Django Model层,纯SQL 转换成JSON格式

1 def getdata(request):
2 # 使用SQL
3     with connection.cursor() as cursor:
4         cursor.execute('select id, machine, tomcathome, ipaddress, description from tomcatData')
5         data = dictfetchall(cursor)
6     return JsonResponse(data, safe=False, json_dumps_params={'ensure_ascii': False})
1 # 将返回结果转换成字典
2 def dictfetchall(cursor):
3     "Return all rows from a cursor as a dict"
4     columns = [col[0] for col in cursor.description]
5     return [
6         dict(zip(columns, row))
7         for row in cursor.fetchall()
8     ]

JsonResponse 对象:

class JsonResponse(data, encoder=DjangoJSONEncoder, safe=True, json_dumps_params=None,**kwargs)

这个类是HttpRespon的子类,它主要和父类的区别在于:

1.它的默认Content-Type 被设置为: application/json

2.第一个参数,data应该是一个字典类型,当 safe 这个参数被设置为:False ,那data可以填入任何能被转换为JSON格式的对象,比如list, tuple, set。 默认的safe 参数是 True. 如果你传入的data数据类型不是字典类型,那么它就会抛出 TypeError的异常。

3.json_dumps_params参数是一个字典,它将调用json.dumps()方法并将字典中的参数传入给该方法。

通过以上的解释,上面两个方法的JsonResponse()里面传入的参数就很清晰明了。

这样数据就会以JSON格式传入到前端,前端就能用AJAX获取到,并进行处理或者展示了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 项目管理之PMP需要掌握的76个成果

    菲宇
  • Scrapy框架中crawlSpider的使用——爬取内容写进MySQL和拉勾网案例

    Scrapy框架中分两类爬虫,Spider类和CrawlSpider类。该案例采用的是CrawlSpider类实现爬虫进行全站抓取。

    菲宇
  • django之序列化

    关于Django中的序列化主要应用在将数据库中检索的数据返回给客户端用户,特别的Ajax请求一般返回的为Json格式。

    菲宇
  • Excel数据分析案例:用Excel的STATIS方法做产品感官数据分析

    案例数据来自冰沙产品实验,24名受试者(小组成员)品尝了8种冰沙,然后放在桌布上。收集成员和产品的坐标以进行分析。如果小组成员认为两种产品相似,则将后者封闭在桌...

    沉默的白面书生
  • 学习华为,小米研究 AI 芯片

    作者 | 阿司匹林 编者注:距离小米澎湃 S1 芯片的发布会已经整整一年了,就连搭载澎湃 S1 的小米 5C 都已经从小米商城消失不见,然而澎湃 S2 却迟迟...

    AI科技大本营
  • SSL连接并非完全安全问题解决

    最近拿到了 TrustAsia 签发的 SSL 证书,在 Nginx 的环境下上了证书。猛然间发现:友链界面没有绿锁。走了不少弯路解决了问题,特此记录下。

    心谭博客
  • struts2实现ajax校验的2种方法

    共同的一点是,Action都需要将一个方法暴露出来,给前端javascript调用  javascript的代码都是一样的:  Js代码  functi...

    xiangzhihong
  • 分布式消息中间件 — MQ

    消息队列(Message Queue,简称 MQ)是阿里巴巴集团中间件技术部自主研发的专业消息中间件。用于保证异构应用之间的消息传递。应用程序通过MQ接口进行互...

    AI乔治
  • 分布式消息中间件 — MQ

    消息队列(Message Queue,简称 MQ)是阿里巴巴集团中间件技术部自主研发的专业消息中间件。用于保证异构应用之间的消息传递。应用程序通过MQ接口进行互...

    烂猪皮
  • 英伟达深度学习中文课程将联手腾讯云上线 | 附课程表

    李根 发自 凹非寺 量子位 报道 | 公众号 QbitAI ? 又一个AI开发者福利。 创立于2016年的NVIDIA深度学习学院(DLI),现在正式宣布找...

    量子位

扫码关注云+社区

领取腾讯云代金券