ajax向Django前后端提交请求和CSRF跨站请求伪造
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跨站请求伪造的更多相关文章
- python 全栈开发，Day87(ajax登录示例,CSRF跨站请求伪造,Django的中间件,自定义分页)
一.ajax登录示例 新建项目login_ajax 修改urls.py,增加路径 from app01 import views urlpatterns = [ path('admin/', admi ...
- Django框架 之 基于Ajax中csrf跨站请求伪造
Django框架 之 基于Ajax中csrf跨站请求伪造 ajax中csrf跨站请求伪造 方式一 1 2 3 $.ajaxSetup({ data: {csrfmiddlewaretoken: ...
- 第三百一十五节，Django框架，CSRF跨站请求伪造
第三百一十五节,Django框架,CSRF跨站请求伪造 全局CSRF 如果要启用防止CSRF跨站请求伪造,就需要在中间件开启CSRF #中间件 MIDDLEWARE = [ 'django.midd ...
- 十三 Django框架，CSRF跨站请求伪造
全局CSRF 如果要启用防止CSRF跨站请求伪造,就需要在中间件开启CSRF #中间件 MIDDLEWARE = [ 'django.middleware.security.SecurityMidd ...
- django 中间键 csrf 跨站请求伪造
django中间件和auth模块 Django中间件 由django的生命周期图我们可以看出,django的中间件就类似于django的保安,请求一个相应时要先通过中间件才能到达django后端( ...
- Django之CSRF跨站请求伪造（老掉牙的钓鱼网站模拟）
首先这是一个测试的代码 请先在setting页面进行下面操作 注释完成后,开始模拟钓鱼网站的跨站请求伪造操作: 前端代码: <!DOCTYPE html> <html lang=&q ...
- Web框架之Django_09 重要组件（Django中间件、csrf跨站请求伪造）
摘要 Django中间件 csrf跨站请求伪造 一.Django中间件: 什么是中间件? 官方的说法:中间件是一个用来处理Django的请求和响应的框架级别的钩子.它是一个轻量.低级别的插件系统,用于 ...
- django上课笔记3-ORM补充-CSRF (跨站请求伪造)
一.ORM补充 ORM操作三大难点: 正向操作反向操作连表 其它基本操作(包含F Q extra) 性能相关的操作 class UserInfo(models.Model): uid = models ...
- Web框架之Django重要组件（Django中间件、csrf跨站请求伪造）
Web框架之Django_09 重要组件(Django中间件.csrf跨站请求伪造) 摘要 Django中间件 csrf跨站请求伪造 一.Django中间件: 什么是中间件? 官方的说法:中间件是 ...
随机推荐
- final等关键字和代码块
一.final关键字 其作用 1.final除构造方法外均可修饰 2.修饰类:被final修饰的类是无法被继承的. 3.修饰方法,可被继承,但是无法被重写 4.修饰变量使其为常量 5.修饰引用型变量, ...
- webpack中插件 prerender-spa-plugin 来进行SEO优化(二十四)
vue.react对于开发单页应用来说带来了很好的用户的体验,但是同样有缺点,比如首页加载慢,白屏或SEO等问题的产生.为什么会出现这种情况呢?我们之前开发单页应用是这样开发的,比如首页 index. ...
- 在Mac OS X中完善PHP环境：memcache、mcrypt、igbinary
本文环境: Mac OS X 10.8.5 Xcode 5.0 Mac OS X升级到10.8.5之后,内置的Apache升级到2.2.24,PHP升级到了5.3.26.本文以此环境为基础. 本文简介 ...
- Linux内存管理 (9)mmap(补充)
之前写过一篇简单的介绍mmap()/munmap()的文章<Linux内存管理 (9)mmap>,比较单薄,这里详细的梳理一下. 从常用的使用者角度介绍两个函数的使用:然后重点是分析内核的 ...
- UOJ129 NOI2015 寿司晚宴 数论、状压DP
传送门 数论题\(n \leq 500\)肯定是什么暴力算法-- 注意到每一个数\(> \sqrt{n}\)的因子最多只有一个,这意味着\(> \sqrt{n}\)的因子之间是独立的,而只 ...
- hbase集群搭建参考资料
hadoop分布式集群搭建 http://www.ityouknow.com/hadoop/2017/07/24/hadoop-cluster-setup.html hbase分布式集群搭建: htt ...
- asp.net core源码地址
https://github.com/dotnet/corefx 这个是.net core的 开源项目地址 https://github.com/aspnet 这个下面是asp.net core 框架 ...
- git中如何撤销部分修改？
以提问中修改了两个文件a.b为例,假设需要撤销文件a的修改,则修改后的两个文件: 1.如果没有被git add到索引区 git checkout a 便可撤销对文件a的修改 2.如果被git add到 ...
- vue 限制输入字符长度
一.watch方法: <input v-model="textareaValue" type="textarea" placeholder="请 ...
- Ubuntu shutdown
gsettings set com.canonical.indicator.session suppress-logout-restart-shutdown true