Django CSRF 检查因 Ajax POST 请求而失败
- 2024-12-06 08:40:00
- admin 原创
- 81
问题描述:
我可以通过我的 AJAX 帖子寻求一些帮助来遵守 Django 的 CSRF 保护机制。我遵循了以下指示:
http://docs.djangoproject.com/en/dev/ref/contrib/csrf/
我准确复制了该页面上的 AJAX 示例代码:
http://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ajax
getCookie('csrftoken')
我在调用之前发出了一条打印内容的警报xhr.setRequestHeader
,它确实填充了一些数据。我不确定如何验证令牌是否正确,但我很高兴它找到并发送了一些东西。
但是 Django 仍然拒绝我的 AJAX 帖子。
这是我的 JavaScript:
$.post("/memorize/", data, function (result) {
if (result != "failure") {
get_random_card();
}
else {
alert("Failed to save card data.");
}
});
以下是我从 Django 看到的错误:
[2011 年 2 月 23 日 22:08:29] “POST /memorize/ HTTP/1.1” 403 2332
我确信我遗漏了一些东西,也许很简单,但我不知道它是什么。我在 SO 上搜索过,看到了一些关于通过csrf_exempt
装饰器关闭我的视图的 CSRF 检查的信息,但我觉得这没有吸引力。我已经尝试过了,而且它有效,但如果可能的话,我宁愿让我的 POST 按照 Django 的设计方式工作。
为了以防万一有帮助,以下是我的观点的要点:
def myview(request):
profile = request.user.profile
if request.method == 'POST':
"""
Process the post...
"""
return HttpResponseRedirect('/memorize/')
else: # request.method == 'GET'
ajax = request.GET.has_key('ajax')
"""
Some irrelevent code...
"""
if ajax:
response = HttpResponse()
profile.get_stack_json(response)
return response
else:
"""
Get data to send along with the content of the page.
"""
return render_to_response('memorize/memorize.html',
""" My data """
context_instance=RequestContext(request))
感谢您的回复!
解决方案 1:
如果您使用该函数,您只需在数据体中$.ajax
添加令牌即可:csrf
$.ajax({
data: {
somedata: 'somedata',
moredata: 'moredata',
csrfmiddlewaretoken: '{{ csrf_token }}'
},
解决方案 2:
真正的解决方案
好的,我设法找出了问题所在。问题出在 Javascript 代码中(正如我下面提到的)。
你需要的是这个:
$.ajaxSetup({
beforeSend: function(xhr, settings) {
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
if (!(/^http:.*/.test(settings.url) || /^https:.*/.test(settings.url))) {
// Only send the token to relative URLs i.e. locally.
xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
}
}
});
而不是官方文档中发布的代码:
https ://docs.djangoproject.com/en/2.2/ref/csrf/
工作代码来自这个 Django 条目: http: //www.djangoproject.com/weblog/2011/feb/08/security/
因此,一般解决方案是:“使用 ajaxSetup 处理程序而不是 ajaxSend 处理程序”。我不知道它为什么有效。但对我来说有效 :)
上一篇文章(无答案)
事实上我也遇到了同样的问题。
它发生在更新到 Django 1.2.5 之后 - Django 1.2.4 中的 AJAX POST 请求没有错误(AJAX 没有受到任何保护,但它运行良好)。
和 OP 一样,我尝试了 Django 文档中发布的 JavaScript 代码片段。我使用的是 jQuery 1.5。我还使用了“django.middleware.csrf.CsrfViewMiddleware”中间件。
我尝试遵循中间件代码但我知道它会失败:
request_csrf_token = request.META.get('HTTP_X_CSRFTOKEN', '')
进而
if request_csrf_token != csrf_token:
return self._reject(request, REASON_BAD_TOKEN)
这个“if”为真,因为“request_csrf_token”是空的。
基本上这意味着未设置标头。那么这行 JS 代码有什么问题吗:
xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
?
我希望提供的详细信息能够帮助我们解决这个问题:)
解决方案 3:
将这一行添加到你的 jQuery 代码中:
$.ajaxSetup({
data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
});
完成。
解决方案 4:
问题在于,django 期望将 cookie 中的值作为表单数据的一部分传回。上一个答案中的代码是让 javascript 找出 cookie 值并将其放入表单数据中。从技术角度来看,这是一种很好的方法,但看起来确实有点冗长。
过去,我通过让 javascript 将令牌值放入帖子数据中来更简单地完成此操作。
如果您在模板中使用 {% csrf_token %},您将获得一个带有值的隐藏表单字段。但是,如果您使用 {{ csrf_token }},您将只获得令牌的裸值,因此您可以在 javascript 中像这样使用它....
csrf_token = "{{ csrf_token }}";
然后,您可以将其与哈希中的所需键名一起包含进去,然后将其作为数据提交给 ajax 调用。
解决方案 5:
放在{% csrf_token %}
html模板里面<form></form>
翻译过来就是:
<input type='hidden' name='csrfmiddlewaretoken' value='Sdgrw2HfynbFgPcZ5sjaoAI5zsMZ4wZR' />
那么为什么不像这样在你的 JS 中 grep 它呢:
token = $("#change_password-form").find('input[name=csrfmiddlewaretoken]').val()
然后将其传递,例如执行一些 POST 操作,如:
$.post( "/panel/change_password/", {foo: bar, csrfmiddlewaretoken: token}, function(data){
console.log(data);
});
解决方案 6:
非 jquery 答案:
var csrfcookie = function() {
var cookieValue = null,
name = 'csrftoken';
if (document.cookie && document.cookie !== '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i].trim();
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
};
用法:
var request = new XMLHttpRequest();
request.open('POST', url, true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.setRequestHeader('X-CSRFToken', csrfcookie());
request.onload = callback;
request.send(data);
解决方案 7:
似乎没有人提到如何使用X-CSRFToken
标题和在纯 JS 中执行此操作{{ csrf_token }}
,因此这里有一个简单的解决方案,您不需要搜索 cookie 或 DOM:
var xhttp = new XMLHttpRequest();
xhttp.open("POST", url, true);
xhttp.setRequestHeader("X-CSRFToken", "{{ csrf_token }}");
xhttp.send();
解决方案 8:
如果您的表单在 Django 中正确发布而无需 JS,那么您应该能够使用 ajax 逐步增强它,而无需任何黑客攻击或混乱地传递 csrf 令牌。只需序列化整个表单,它将自动获取所有表单字段,包括隐藏的 csrf 字段:
$('#myForm').submit(function(){
var action = $(this).attr('action');
var that = $(this);
$.ajax({
url: action,
type: 'POST',
data: that.serialize()
,success: function(data){
console.log('Success!');
}
});
return false;
});
我已经使用 Django 1.3+ 和 jQuery 1.5+ 测试过此功能。显然,此功能适用于任何 HTML 表单,而不仅仅是 Django 应用。
解决方案 9:
可接受的答案很可能是转移注意力的借口。Django 1.2.4 和 1.2.5 之间的区别在于 AJAX 请求需要 CSRF 令牌。
我在 Django 1.3 上遇到了这个问题,这是因为一开始就没有设置 CSRF cookie。除非必须,否则 Django 不会设置 cookie。因此,在 Django 1.2.4 上运行的专门或大量使用 ajax 的网站可能永远不会向客户端发送令牌,然后需要令牌的升级将导致 403 错误。
理想的修复方法是:http:
//docs.djangoproject.com/en/dev/ref/contrib/csrf/#page-uses-ajax-without-any-html-form,
但你必须等到 1.4,除非这只是文档赶上代码
编辑
还要注意,后续的 Django 文档指出了 jQuery 1.5 中的一个错误,因此请确保你使用的是 1.5.1 或更高版本,并遵循 Django 建议的代码:
https ://docs.djangoproject.com/en/dev/ref/csrf/#ajax
解决方案 10:
使用带有 Firebug 的 Firefox。在触发 ajax 请求时打开“控制台”选项卡。DEBUG=True
您将获得漂亮的 django 错误页面作为响应,甚至可以在控制台选项卡中看到 ajax 响应的呈现 html。
然后你就会知道错误是什么了。
解决方案 11:
由于当前答案中没有任何地方说明,如果您没有将 js 嵌入到模板中,最快的解决方案是:
<script type="text/javascript"> window.CSRF_TOKEN = "{{ csrf_token }}"; </script>
在模板中将对 script.js 文件的引用放在前面,然后在 js 文件的字典中csrfmiddlewaretoken
添加:data
$.ajax({
type: 'POST',
url: somepathname + "do_it/",
data: {csrfmiddlewaretoken: window.CSRF_TOKEN},
success: function() {
console.log("Success!");
}
})
解决方案 12:
我刚刚遇到了一个略有不同但类似的情况。不能 100% 确定这是否能解决您的问题,但我通过设置 POST 参数“csrfmiddlewaretoken”解决了 Django 1.3 的问题,该参数带有正确的 cookie 值字符串,通常由 Django 的模板系统使用“{% csrf_token %}”标签在您的主页 HTML 表单中返回。我没有在旧版 Django 上尝试,只是在 Django1.3 上碰巧解决了。我的问题是,通过表单通过 Ajax 提交的第一个请求成功完成,但第二次尝试从完全相同的表单失败,导致 403 状态,即使标头“X-CSRFToken”与 CSRF 令牌值正确放置,就像第一次尝试的情况一样。希望这能有所帮助。
问候,
弘
解决方案 13:
你可以将这个 js 粘贴到你的 html 文件中,记得把它放在其他 js 函数之前
<script>
// using jQuery
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
function csrfSafeMethod(method) {
// these HTTP methods do not require CSRF protection
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$(document).ready(function() {
var csrftoken = getCookie('csrftoken');
$.ajaxSetup({
beforeSend: function(xhr, settings) {
if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
}
});
});
</script>
解决方案 14:
使用 Django 轻松进行 ajax 调用
(2020 年 10 月 26 日)
在我看来,这比正确答案更干净、更简单。
视图
@login_required
def some_view(request):
"""Returns a json response to an ajax call. (request.user is available in view)"""
# Fetch the attributes from the request body
data_attribute = request.GET.get('some_attribute') # Make sure to use POST/GET correctly
# DO SOMETHING...
return JsonResponse(data={}, status=200)
urls.py
urlpatterns = [
path('some-view-does-something/', views.some_view, name='doing-something'),
]
ajax 调用
ajax 调用非常简单,但在大多数情况下已经足够了。您可以获取一些值并将它们放入数据对象中,然后在上面描述的视图中,您可以通过它们的名称再次获取它们的值。
您可以在django 的文档中找到 csrftoken 函数。基本上只需复制它并确保它在 ajax 调用之前呈现,以便定义csrftoken 变量。
$.ajax({
url: "{% url 'doing-something' %}",
headers: {'X-CSRFToken': csrftoken},
data: {'some_attribute': some_value},
type: "GET",
dataType: 'json',
success: function (data) {
if (data) {
console.log(data);
// call function to do something with data
process_data_function(data);
}
}
});
使用 ajax 将 HTML 添加到当前页面
这可能有点偏离主题,但我很少看到这种用法,它是最小化窗口重定位以及在 javascript 中手动创建 html 字符串的好方法。
这与上面的非常相似,但这次我们从响应中呈现 html 而不重新加载当前窗口。
如果您打算从作为对 ajax 调用的响应而收到的数据中呈现某种 html,那么从视图发回 HttpResponse 可能比发回 JsonResponse 更容易。这样您就可以轻松创建 html,然后将其插入到元素中。
视图
# The login required part is of course optional
@login_required
def create_some_html(request):
"""In this particular example we are filtering some model by a constraint sent in by
ajax and creating html to send back for those models who match the search"""
# Fetch the attributes from the request body (sent in ajax data)
search_input = request.GET.get('search_input')
# Get some data that we want to render to the template
if search_input:
data = MyModel.objects.filter(name__contains=search_input) # Example
else:
data = []
# Creating an html string using template and some data
html_response = render_to_string('path/to/creation_template.html', context = {'models': data})
return HttpResponse(html_response, status=200)
视图的 html 创建模板
创作模板.html
{% for model in models %}
<li class="xyz">{{ model.name }}</li>
{% endfor %}
urls.py
urlpatterns = [
path('get-html/', views.create_some_html, name='get-html'),
]
主模板和 ajax 调用
这是我们要添加数据的模板。在这个例子中,我们有一个搜索输入和一个按钮,它将搜索输入的值发送到视图。然后,视图发回一个 HttpResponse,显示与我们可以在元素内呈现的搜索相匹配的数据。
{% extends 'base.html' %}
{% load static %}
{% block content %}
<input id="search-input" placeholder="Type something..." value="">
<button id="add-html-button" class="btn btn-primary">Add Html</button>
<ul id="add-html-here">
<!-- This is where we want to render new html -->
</ul>
{% end block %}
{% block extra_js %}
<script>
// When button is pressed fetch inner html of ul
$("#add-html-button").on('click', function (e){
e.preventDefault();
let search_input = $('#search-input').val();
let target_element = $('#add-html-here');
$.ajax({
url: "{% url 'get-html' %}",
headers: {'X-CSRFToken': csrftoken},
data: {'search_input': search_input},
type: "GET",
dataType: 'html',
success: function (data) {
if (data) {
/* You could also use json here to get multiple html to
render in different places */
console.log(data);
// Add the http response to element
target_element.html(data);
}
}
});
})
</script>
{% endblock %}
解决方案 15:
2022 年更新
在 CSRF 攻击中,无辜的最终用户被攻击者诱骗提交他们不想要的 Web 请求
选项 1
from django.views.decorators.csrf import csrf_exempt
from django.http.response import JsonResponse
@csrf_exempt
def commentDeletePost(request):
if request.is_ajax() and request.method == 'POST':
try:
comment = Comment.objects.get(pk=request.POST['pk'])
if comment.author != request.user:
return JsonResponse({'e': 'Forbidden'}, status=403)
comment.delete()
return JsonResponse({}, status=200)
execpt Comment.DoesNotExist:
return JsonResponse({'e': 'Not Found'}, status=404)
选项 2
<div id="csrf">
{% csrf_token %}
</div>
<script type="text/javascript">
window.crud = {
commentDelete: function(
pk,
success,
error,
){
$.ajax({
headers: {'X-CSRFToken': document.getElementById('csrf').querySelector('input').value},
type: "POST",
url: "{% url 'comment-delete-post' %}",
data: {
pk: pk,
},
success: success,
error: error,
})
},
}
</script>
两种选择各有优势。第一种选择将丢弃 csrf token,这不会保护您的网站免受 csrf 攻击,但它将允许用户使用相同的 Ajax 函数发送多个请求。第二种选择将限制用户只能发送一个 Ajax 请求,因为 csrf token 只能使用一次,但它更安全。我个人更喜欢选项 1,因为 Ajax 函数like, star, unlike
需要多次 Ajax 调用,而允许用户多次调用并不是一个危险的函数。
解决方案 16:
就我而言,问题在于我将 nginx 配置从主服务器复制到临时服务器,并禁用了过程中第二台服务器不需要的 https。
我必须在配置中注释掉这两行才能使其再次工作:
# uwsgi_param UWSGI_SCHEME https;
# uwsgi_pass_header X_FORWARDED_PROTO;
解决方案 17:
每个会话都会分配一个 CSRF 令牌(即每次登录时)。因此,在您希望获取用户输入的某些数据并将其作为 ajax 调用发送到受 csrf_protect 装饰器保护的某个函数之前,请尝试找到在从用户那里获取这些数据之前调用的函数。例如,必须呈现某个模板,用户正在该模板上输入数据。该模板由某个函数呈现。在此函数中,您可以按如下方式获取 csrf 令牌:csrf = request.COOKIES['csrftoken']现在将此 csrf 值传递给正在呈现相关模板的上下文字典。现在在该模板中写入此行:现在在您的 javascript 函数中,在发出 ajax 请求之前,写入以下内容:var csrf = $('#csrf').val()这将选择传递给模板的令牌的值并将其存储在变量 csrf 中。现在,在进行 ajax 调用时,在您的帖子数据中,也传递此值:“csrfmiddlewaretoken”:csrf
即使您没有实现 django 表单,它也能起作用。
事实上,这里的逻辑是:您需要可以从请求中获取的令牌。因此,您只需找出登录后立即调用的函数即可。获得此令牌后,可以进行另一个 ajax 调用来获取它,也可以将其传递给您的 ajax 可以访问的某个模板。
解决方案 18:
对于遇到此问题并尝试调试的人:
1)django csrf 检查(假设你正在发送一个)在这里
2) 在我的例子中,settings.CSRF_HEADER_NAME
设置为“HTTP_X_CSRFTOKEN”,而我的 AJAX 调用发送了一个名为“HTTP_X_CSRF_TOKEN”的标头,因此无法正常工作。我可以在 AJAX 调用或 django 设置中更改它。
3)如果您选择在服务器端进行更改,请找到 django 的安装位置并在csrf middleware
您正在使用的 .f中抛出一个断点virtualenv
,它将类似于:~/.envs/my-project/lib/python2.7/site-packages/django/middleware/csrf.py
import ipdb; ipdb.set_trace() # breakpoint!!
if request_csrf_token == "":
# Fall back to X-CSRFToken, to make things easier for AJAX,
# and possible for PUT/DELETE.
request_csrf_token = request.META.get(settings.CSRF_HEADER_NAME, '')
然后,确保csrf
令牌正确来源于 request.META
4)如果您需要更改标题等 - 请在设置文件中更改该变量
解决方案 19:
如果有人正在努力使用 axios 来完成这项工作,这对我有帮助:
import axios from 'axios';
axios.defaults.xsrfCookieName = 'csrftoken'
axios.defaults.xsrfHeaderName = 'X-CSRFToken'
来源:https://cbuelter.wordpress.com/2017/04/10/django-csrf-with-axios/
解决方案 20:
以下是 Django 提供的一个不太冗长的解决方案:
<script type="text/javascript">
// using jQuery
var csrftoken = jQuery("[name=csrfmiddlewaretoken]").val();
function csrfSafeMethod(method) {
// these HTTP methods do not require CSRF protection
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
// set csrf header
$.ajaxSetup({
beforeSend: function(xhr, settings) {
if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
}
});
// Ajax call here
$.ajax({
url:"{% url 'members:saveAccount' %}",
data: fd,
processData: false,
contentType: false,
type: 'POST',
success: function(data) {
alert(data);
}
});
</script>
来源:https://docs.djangoproject.com/en/1.11/ref/csrf/
解决方案 21:
使用 Django 3.1.1 和我尝试的所有解决方案都失败了。但是,将“csrfmiddlewaretoken”键添加到我的 POST 正文中却有效。这是我所做的调用:
$.post(url, {
csrfmiddlewaretoken: window.CSRF_TOKEN,
method: "POST",
data: JSON.stringify(data),
dataType: 'JSON',
});
在 HTML 模板中:
<script type="text/javascript">
window.CSRF_TOKEN = "{{ csrf_token }}";
</script>
解决方案 22:
与所选答案相关,只是想补充所选答案。
在那个答案中,关于解决方案.ajaxSetup(...)
。在你的Django settings.py中,如果你有
CSRF_USE_SESSIONS = True
这会导致所选答案完全不起作用。删除该行或将其设置为 False 对我而言有效,同时实现了所选答案的解决方案。
有趣的是,如果你在 Django settings.py 中设置以下内容
CSRF_COOKIE_HTTPONLY = True
该变量不会导致所选答案的解决方案停止运行。
CSRF_USE_SESSIONS
和均CSRF_COOKIE_HTTPONLY
来自此官方 Django 文档https://docs.djangoproject.com/en/2.2/ref/csrf/
(我没有足够的声誉来发表评论,因此我将我的意见发布在答案中)
解决方案 23:
我有一个解决方案。在我的 JS 中我有两个函数。首先获取 Cookies(即 csrftoken):
function getCookie(name) {
let cookieValue = null;
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
第二个是我的 ajax 函数。在这种情况下,它用于登录并且实际上不返回任何东西,只是传递值来设置会话:
function LoginAjax() {
//get scrftoken:
const csrftoken = getCookie('csrftoken');
var req = new XMLHttpRequest();
var userName = document.getElementById("Login-Username");
var password = document.getElementById("Login-Password");
req.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
//read response loggedIn JSON show me if user logged in or not
var respond = JSON.parse(this.responseText);
alert(respond.loggedIn);
}
}
req.open("POST", "login", true);
//following header set scrftoken to resolve problem
req.setRequestHeader('X-CSRFToken', csrftoken);
req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
req.send("UserName=" + userName.value + "&Password=" + password.value);
}
- 2024年20款好用的项目管理软件推荐,项目管理提效的20个工具和技巧
- 2024年开源项目管理软件有哪些?推荐5款好用的项目管理工具
- 项目管理软件有哪些?推荐7款超好用的项目管理工具
- 2024年常用的项目管理软件有哪些?推荐这10款国内外好用的项目管理工具
- 项目管理软件有哪些最好用?推荐6款好用的项目管理工具
- 项目管理软件哪个最好用?盘点推荐5款好用的项目管理工具
- 项目管理软件有哪些,盘点推荐国内外超好用的7款项目管理工具
- 项目管理软件排行榜:2024年项目经理必备5款开源项目管理软件汇总
- 2024项目管理软件排行榜(10类常用的项目管理工具全推荐)
- 项目管理必备:盘点2024年13款好用的项目管理软件