1.ajax登录示例

urls.py

from django.conf.urls import url

from django.contrib import admin

from app01 import views

urlpatterns = [

    url(r'^admin/', admin.site.urls),

    url(r'^login_ajax/$', views.login_ajax, name='login_ajax'),

    url(r'^index/$', views.index, name='index'),

]

views.py

from django.shortcuts import render, HttpResponse, redirect

import json

def index(request):

    return HttpResponse('this is index')

def login_ajax(request):

    if request.method == "POST":

        user = request.POST.get("user")

        pwd = request.POST.get("pwd")

        ret = {"status": 0, 'url': ''}

        if user == "alex" and pwd == "":

            ret['status'] = 1

            ret['url'] = '/index/'

        return HttpResponse(json.dumps(ret))

    return render(request, "login_ajax.html")

login.html登录页面

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="x-ua-compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>登录</title>

    <link rel="stylesheet" href="/static/plugins/bootstrap-3.3.7-dist/css/bootstrap.css">

    <link rel="stylesheet" href="/static/css/signin.css">

</head>

<body>

<div class="container">

    <form class="form-signin" action="{% url 'login' %}" method="post">

        {% csrf_token %}

        <h2 class="form-signin-heading">请登录</h2>

        <label for="inputUser" class="sr-only">用户名</label>

        <input type="text" id="inputUser" class="form-control" placeholder="用户名" required="" autofocus="" name="user">

        <label for="inputPassword" class="sr-only">密码</label>

        <input type="password" id="inputPassword" class="form-control" placeholder="密码" required="" name="pwd">

        <div class="checkbox">

            <label>

                <input type="checkbox" value="remember-me"> 记住我

            </label>

        </div>

        <input class="btn btn-lg btn-primary btn-block" id="login" value="登陆">

    </form>

</div> <!-- /container -->

<script src="/static/jquery-3.3.1.min.js"></script>

<script>

    $('#login').click(function () {

        $.ajax({

            url: '/login_ajax/',

            type: 'post',

            data: {

                csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),

                user: $('[name="user"]').val(),

                pwd: $('[name="pwd"]').val()

            },

            success: function (data) {

                data = JSON.parse(data);

                if (data.status) {

                    window.location = data.url

                }

                else {

                    alert('登陆失败')

                }

            }

        })

    })

</script>

</body>

</html>

静态文件需要配置，使用了jQuery和Bootstrap。

2.CSRF跨站请求伪造

一共四种方式

1，将 csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val() 放在POST的请求体中。

示例中就是使用的这种方式。

2，给ajax的请增加X-CSRFToken的请求头，对应的值只能是cookie中的csrftoken的值。

所以我们要从cookie中提取csrftoken的值，jQuery不能去cookie，我们使用jquery.cookie的插件。点击下载jquer.cookie插件。

HTML中导入jquery.cookie.js。

<script src="/static/jquery-3.3.1.min.js"></script>

<script src="/static/jquery.cookie.js"></script>

<script>

    $('#login').click(function () {

        $.ajax({

            url: '/login_ajax/',

            type: 'post',

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

            data: {

                user: $('[name="user"]').val(),

                pwd: $('[name="pwd"]').val()

            },

            success: function (data) {

                data = JSON.parse(data);

                if (data.status) {

                    window.location = data.url

                }

                else {

                    alert('登陆失败')

                }

            }

        })

    })

</script>

3，使用$.ajaxSetup()给全局的ajax添加默认参数。

可以按照方式一设置data，也可以按照方式二设置请求头。

$.ajaxSetup({

    data: {

        csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),

    }

});

或者

$.ajaxSetup({

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

});

4，官方推荐方法（用到jquery.cookie插件）：

function csrfSafeMethod(method) {

    // these HTTP methods do not require CSRF protection

    return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));

}

$.ajaxSetup({

    beforeSend: function (xhr, settings) {

        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {

            xhr.setRequestHeader("X-CSRFToken", $.cookie('csrftoken'));

        }

    }

});

ajax向Django前后端提交请求和CSRF跨站请求伪造的更多相关文章

  1. python 全栈开发，Day87(ajax登录示例,CSRF跨站请求伪造,Django的中间件,自定义分页)

    一.ajax登录示例 新建项目login_ajax 修改urls.py,增加路径 from app01 import views urlpatterns = [ path('admin/', admi ...

  2. Django框架 之 基于Ajax中csrf跨站请求伪造

    Django框架 之 基于Ajax中csrf跨站请求伪造 ajax中csrf跨站请求伪造 方式一 1 2 3 $.ajaxSetup({     data: {csrfmiddlewaretoken: ...

  3. 第三百一十五节，Django框架，CSRF跨站请求伪造

    第三百一十五节,Django框架,CSRF跨站请求伪造  全局CSRF 如果要启用防止CSRF跨站请求伪造,就需要在中间件开启CSRF #中间件 MIDDLEWARE = [ 'django.midd ...

  4. 十三 Django框架，CSRF跨站请求伪造

     全局CSRF 如果要启用防止CSRF跨站请求伪造,就需要在中间件开启CSRF #中间件 MIDDLEWARE = [ 'django.middleware.security.SecurityMidd ...

  5. django 中间键 csrf 跨站请求伪造

    django中间件和auth模块   Django中间件 由django的生命周期图我们可以看出,django的中间件就类似于django的保安,请求一个相应时要先通过中间件才能到达django后端( ...

  6. Django之CSRF跨站请求伪造（老掉牙的钓鱼网站模拟）

    首先这是一个测试的代码 请先在setting页面进行下面操作 注释完成后,开始模拟钓鱼网站的跨站请求伪造操作: 前端代码: <!DOCTYPE html> <html lang=&q ...

  7. Web框架之Django_09 重要组件（Django中间件、csrf跨站请求伪造）

    摘要 Django中间件 csrf跨站请求伪造 一.Django中间件: 什么是中间件? 官方的说法:中间件是一个用来处理Django的请求和响应的框架级别的钩子.它是一个轻量.低级别的插件系统,用于 ...

  8. django上课笔记3-ORM补充-CSRF (跨站请求伪造)

    一.ORM补充 ORM操作三大难点: 正向操作反向操作连表 其它基本操作(包含F Q extra) 性能相关的操作 class UserInfo(models.Model): uid = models ...

  9. Web框架之Django重要组件（Django中间件、csrf跨站请求伪造）

    Web框架之Django_09 重要组件(Django中间件.csrf跨站请求伪造)   摘要 Django中间件 csrf跨站请求伪造 一.Django中间件: 什么是中间件? 官方的说法:中间件是 ...

随机推荐

  1. redis 基本原理及安装

    一:什么是redis? Redis 是一个开源的,高性能的,基于键值对的缓存与存储系统.通过提供多种键值数据类型来适应不同场景下的缓存与存储需求. 二:redis数据库有什么优点? Redis数据库中 ...

  2. C# — 实现软件开机自启功能（不需要管理员权限）

    因为最近项目需要,昨晚花了2个小时的时间,在网上搜索资料,通过C#实现了程序开机自启的功能,思路是:将软件的快捷方式创建到计算机的自动启动目录下就行了. 1.新建一个控制台项目:AutoStart 2 ...

  3. vs2017创建.net core 应用程序，发布到Linux

    1.打开vs2017,创建.net core 应用程序 压缩上传到linux

  4. Set.js--创建无重复值的无序集合

    Set 集合,不同于 Array,是一种没有重复值的集合. 以下代码出自于<JavaScript 权威指南(第六版)>P217,注意:这里并不是指 es6 / es2015 中的 Set ...

  5. .NET Core 实现 Redis 批量查询指定格式的Key

    一. 问题场景 Redis 作为当前最流行的内存型 NoSQL 数据库,被许多公司所使用,作为分布式缓存.我们在实际使用中一般都会为 key 带上指定的前缀或者其他定义的格式.当由于我们程序出现bug ...

  6. HDU-1695 莫比乌斯反演

    这里学习一下莫比乌斯反演 翻看了很多书,发现莫比乌斯反演,准确来说不是一种固有的公式,而是一种法则. 我们定义F(n),为f(d)的和函数,而定义f(n)为某儿算术函数. 反演公式1:反演n的因子时 ...

  7. Codeforces Round #546 (Div. 2)-D - Nastya Is Buying Lunch

    这道题,神仙贪心题... 题意就是我给出数的顺序,并给出多个交换,每个只能用于相邻交换,问最后一个元素,最多能往前交换多少步. 我们考虑这样一个问题,如果一个这数和a[n]发生交换,那么这个数作为后面 ...

  8. PS调出米黄色复古柔和外景人物照

    配色思路 从片中可以看出主要景物近处的有人物和栏杆,远处的海水,天空和礁石.为体现出远近层次,近处景物选择了偏黄的色调,远处景物选择了偏青色调. 调色 以下面这张照片为例,先放上对比图: LR部分 首 ...

  9. PLSQL：orecal，tnsname简介

    导入ORACLE遇到很多问题,学了好多,其中很长时间花在网络配置上,刚开始学,具体原因不知道,先把搜集到的好文章存下来,以后慢慢研究. 监听配置文件             为了使得外部进程 如 CA ...

  10. 语义SLAM研究现状总结

    博客转载自:https://blog.csdn.net/xiaoxiaowenqiang/article/details/81051010 原文标题:深度学习结合SLAM 语义slam 语义分割 端到 ...