首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Python

django框架中ajax的使用及避开CSRF 验证的方式详解

Posted in Python onDecember 11, 2019

本文实例讲述了django框架中ajax的使用及避开CSRF 验证的方式。分享给大家供大家参考，具体如下：

ajax(Asynchronous Javascript And Xml) 异步javascript和XML

ajax的优点

使用javascript技术向服务器发送异步请求

ajax无须刷新整个页面；

由于ajax响应的是局部页面，因此性能要高

当以get的方式向服务器发送请求：

views.py

def user_valid(request):
  name=request.GET.get("name")
  ret=Author.objects.filter(name=name)
  res={"state":True,"msg":""}
  if ret:
    res["state"]=False
    res["msg"]="用户存在"
  import json
  return HttpResponse(json.dumps(res)) #向ajax发送json数据
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<p>ajax请求</p>
<button class="s1">send_ajax</button>
<p class="con"></p>
<hr><p>用户名：<input type="text" id="user"><span class="error"></span></p>
<script src="/static/js/jquery-3.3.1.min.js">
</script>
<script>
  $(".s1").click(function(){
    $.ajax({
      url:"/send_ajax/",
      type:"get",
      data:{},
      success:function(data){
        $(".con").html(data)
      }
    })
  });
   $("#user").blur(function () {   //鼠标失去焦点事件
    $.ajax({
      url: "/user_valid/",
      type: "get",
      data: {"name": $("#user").val()},
      success: function (data) {
        console.log(data);
        console.log(typeof data);
        var data = JSON.parse(data); //接收传来的信息，进行反序列化，这里JSON要输入大写否则出不来
        console.log(data);
        console.log(typeof data);
        if (!data.state) {
          $(".error").html(data.msg).css("color", "red") #这里的css样式是以，隔开的
        }
      }
    })
  });</script>
</body>
</html>

下面是以post的方式提交，并且跨域伪造csrf的方式（三种）

def user_valid(request):
  name = request.POST.get("name")
  ret=Author.objects.filter(name=name)
  res={"state":True,"msg":""}
  if ret:
    res["state"]=False
    res["msg"]="用户存在"
  import json
  return HttpResponse(json.dumps(res))
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<p>ajax请求</p>
<button class="s1">send_ajax</button>
<p class="con"></p>
<hr>
{% csrf_token %} #方式一
<p>用户名：<input type="text" id="user"><span class="error"></span></p>
<script src="/static/js/jquery-3.3.1.min.js">
</script>
<script>
  $(".s1").click(function(){
    $.ajax({
      url:"/send_ajax/",
      type:"get",
      data:{},
      success:function(data){
        $(".con").html(data)
      }
    })
  });
  //下面改成post请求如何避免crsf错误呢
     $("#user").blur(function () {
    $.ajax({
      url: "/user_valid/",
      type: "post",
      data: {"name": $("#user").val(),
        "csrfmiddlewaretoken":$("[name='csrfmiddlewaretoken']").val(), //方式二


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



　
      success: function (data) {
        console.log(data);
        console.log(typeof data);
        var data = JSON.parse(data);
        console.log(data);
        console.log(typeof data);
        if (!data.state) {
          $(".error").html(data.msg).css("color", "red")
        }
      }
    })
  });
</script>
</body>
</html>

下面是效果

django框架中ajax的使用及避开CSRF 验证的方式详解

如何不用上面的方式，也可以通过csrf中的csrf_exempt 的方法排除验证csrf

方式一：在views.py里面修改

#urls.py里面
url(r'^login/$',views.LoginView.as_view()),
#views.py
from django.shortcuts import render,HttpResponse,redirect
from django.views.decorators.csrf import csrf_exempt  #导入
# Create your views here.
from rbac.models import UserInfo
from django.views import View
class LoginView(View):
  def get(self,request):
    return render(request,"login.html")
  def post(self,request):
    user=request.POST.get("user")
    pwd=request.POST.get("pwd")
    user=UserInfo.objects.filter(name=user,pwd=pwd).first()
    print(user,user.pk)
    if user:
      request.session["user_id"]=user.pk
      #将用户的权限注册到session中
      permission_list=[]
      ret=user.roles.all().values("permissions__url").distinct()
      for per in ret:
        permission_list.append(per.get("permissions__url"))
      # print(ret)
      request.session["permission_list"]=permission_list
      return HttpResponse("ok")
    return HttpResponse("用户名或密码错误")
  @csrf_exempt #当继承django里面的类时，必须要写一个dispath方式，并写在它上面
  def dispatch(self,*args,**kwargs):
    # return super(LoginView,self).dispatch(*args,**kwargs) #这两个方法都可以
    return super().dispatch(*args, **kwargs)

方式二：加入到urls里面

# urls
from django.views.decorators.csrf import csrf_exempt
   url(r'^login/$',csrf_exempt(views.LoginView.as_view())), #加入到urls里面
#views.py
from django.shortcuts import render,HttpResponse,redirect
# Create your views here.
from rbac.models import UserInfo
from django.views import View
class LoginView(View):
  def get(self,request):
    return render(request,"login.html")
  def post(self,request):
    user=request.POST.get("user")
    pwd=request.POST.get("pwd")
    user=UserInfo.objects.filter(name=user,pwd=pwd).first()
    print(user,user.pk)
    if user:
      request.session["user_id"]=user.pk
      #将用户的权限注册到session中
      permission_list=[]
      ret=user.roles.all().values("permissions__url").distinct()
      for per in ret:
        permission_list.append(per.get("permissions__url"))
      # print(ret)
      request.session["permission_list"]=permission_list
      return HttpResponse("ok")
    return HttpResponse("用户名或密码错误")

ajax处理json数据

1 我们在views里面向ajax发送一个json数据

def send_ajax(request):
  import json
  return HttpResponse(json.dumps({"name":"xinxin"}))
#index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<p>ajax请求</p>
<button class="s1">send_ajax</button>
<p class="con"></p>
<hr>
{% csrf_token %}
<p>用户名：<input type="text" id="user"><span class="error"></span></p>
<script src="/static/js/jquery-3.3.1.min.js">
</script>
<script>
//没有指定dataType的情况
/* $(".s1").click(function(){
    $.ajax({
      url:"/send_ajax/",
      success:function(data){
        console.log(data); //{"name": "xinxin"}
        console.log(typeof(data)); //string
      }
    })
  });*/
//指定dataType的情况
  $(".s1").click(function(){
    $.ajax({
      url:"/send_ajax/",
      dataType:"json", //主要T要大写
      success:function(data){
        console.log(data); //Object {name: "xinxin"} 类型发生了变化
        console.log(typeof(data)); // object
      },
      error:function(jqXHR,textStatus,err){
        console.log(err); 
        console.log("数据错误。。。。。。。")
      }
    })
  });
</script>

2 向ajax发送一个其他数据时

def send_ajax(request):
  return HttpResponse("{'name':'xinxin'}")
#index.html
//指定dataType的情况
  $(".s1").click(function(){
    $.ajax({
      url:"/send_ajax/",
      dataType:"json", //主要T要大写
      success:function(data){
        console.log(data); //Object {name: "xinxin"} 类型发生了变化
        console.log(typeof(data)); // object
      },
      error:function(jqXHR,textStatus,err){
        console.log(err);  //报错打印出错误信息
        console.log("数据错误。。。。。。。") //制定错误信息
      }
    })
  });

希望本文所述对大家基于Django框架的Python程序设计有所帮助。

django框架中ajax的使用及避开CSRF 验证的方式详解

- Author -

dawn-liu

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Python 相关文章推荐
Python对数据库操作
Mar 28 Python
python 实现自动远程登陆scp文件实例代码
Mar 13 Python
Python新手们容易犯的几个错误总结
Apr 01 Python
Python和Java进行DES加密和解密的实例
Jan 09 Python
详解Python自建logging模块
Jan 29 Python
python 基本数据类型占用内存空间大小的实例
Jun 12 Python
使用pandas将numpy中的数组数据保存到csv文件的方法
Jun 14 Python
tensor和numpy的互相转换的实现示例
Aug 02 Python
Python3 shelve对象持久存储原理详解
Mar 23 Python
keras绘制acc和loss曲线图实例
Jun 15 Python
python能做哪方面的工作
Jun 15 Python
彻底搞懂python 迭代器和生成器
Sep 07 Python
通过实例解析Python调用json模块
Dec 11 #Python
Flask中endpoint的理解(小结)
Dec 11 #Python
Python中Flask-RESTful编写API接口(小白入门)
Dec 11 #Python
Python zip函数打包元素实例解析
Dec 11 #Python
基于Python实现扑克牌面试题
Dec 11 #Python
Python如何使用argparse模块处理命令行参数
Dec 11 #Python
opencv3/C++ 平面对象识别&amp;透视变换方式
Dec 11 #Python
ipyvizzu(1) matplotlib(7) bufio(1) 可视化动图(1) 条形图(1) 数据同步(1) 微信小程序(9) pdfkit(1) 蒙特卡罗(1) 阿里云(6)
You might like
浅谈PHP eval()函数定义和用法
2016/06/21 PHP
将PHP的session数据存储到数据库中的代码实例
2016/06/24 PHP
Yii净化器CHtmlPurifier用法示例(过滤不良代码)
2016/07/15 PHP
PHP实现的获取文件mimes类型工具类示例
2018/04/08 PHP
基于jquery的模态div层弹出效果
2010/08/21 Javascript
jquery实现的图片点击滚动效果
2014/04/29 Javascript
JavaScript调试工具汇总
2014/12/23 Javascript
nodejs进阶(6)—连接MySQL数据库示例
2017/01/07 NodeJs
JSONP跨域请求
2017/03/02 Javascript
Vue2.0 给Tab标签页和页面切换过渡添加样式的方法
2018/03/13 Javascript
详解vue-router 初始化时做了什么
2018/06/11 Javascript
vue 移动端适配方案详解
2018/11/15 Javascript
JavaScript数组特性与实践应用深入详解
2018/12/30 Javascript
Vue配置marked链接添加target=&quot;_blank&quot;的方法
2019/07/19 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
2020/02/01 Javascript
js表达式与运算符简单操作示例
2020/02/15 Javascript
跟老齐学Python之大话题小函数(2)
2014/10/10 Python
Python 数据结构之队列的实现
2017/01/22 Python
把pandas转换int型为str型的方法
2019/01/29 Python
python中的句柄操作的方法示例
2019/06/20 Python
django框架实现模板中获取request 的各种信息示例
2019/07/01 Python
Python3视频转字符动画的实例代码
2019/08/29 Python
Django密码存储策略分析
2020/01/09 Python
Python下划线5种含义代码实例解析
2020/07/10 Python
Draper James官网：知名演员瑞茜·威瑟斯彭所创品牌
2017/10/25 全球购物
Keds加拿大官网：购买帆布运动鞋和皮鞋
2019/09/26 全球购物
妇科医生自荐信
2013/11/05 职场文书
光信息科学与技术专业职业生涯规划
2014/03/13 职场文书
光棍节联谊晚会活动策划书
2014/10/10 职场文书
2015年保洁员工作总结
2015/05/04 职场文书
反腐倡廉主题教育活动总结
2015/05/07 职场文书
法定代表人身份证明书
2015/06/18 职场文书
英语读书笔记
2015/07/02 职场文书
2015年小学语文教师工作总结
2015/10/23 职场文书
python基于turtle绘制几何图形
2021/06/15 Python
Python 视频画质增强
2022/04/28 Python