[英]error: “CSRF verification failed. Request aborted.” when using jquery ajax with Django
在模板中:
<script type="text/javascript">
$.ajax({
type:"POST",
url:"{% url DrHub.views.ajxTest %}",
data: {
'start': $('#id_startTime').val(),
'end': $('#id_endTime').val(),
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function(data){
alert(data);
}
});
</script>
.
.
.
<form method='POST' action=".">
{% csrf_token %}
<input type="text id="id_startTime" />
<input type="text id="id_endTime" />
<input type="submit" value="send" />
</form>
在视图中:
def ajxTest(request):
if request.is_ajax():
if request.method == 'POST':
return HttpResponse(json.dumps({'message' : 'awesome'},ensure_ascii=False), mimetype='application/javascript')
在 settings.py 中:
MIDDLEWARE_CLASSES = (
'django.middleware.common.CommonMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.locale.LocaleMiddleware',
)
提交表单时出现此错误: CSRF verification failed. Request aborted.
CSRF verification failed. Request aborted.
我搜索了很多,但没有一个建议的解决方案对我有用!
像: Django CSRF 检查因 Ajax POST 请求而失败
我重新定义了一个包含以下内容的 js 文件:
$.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'));
}
}
});
但这也不起作用!
我看到一个解决方案说使用 ajaxSetup 而不是 ajaxSend 来发布数据,我该怎么做?
您应该从 dom 元素中提取 csrfmiddlewaretoken:
{'csrfmiddlewaretoken':$( "#csrfmiddlewaretoken" ).val()}
以上正是我在几个地方所做的,并且有效。
编辑只是为了从您的材料中添加一些清晰度图:
<script type="text/javascript">
$.ajax({
type:"POST",
url:"{% url DrHub.views.ajxTest %}",
data: {
'start': $('#id_startTime').val(),
'end': $('#id_endTime').val(),
'csrfmiddlewaretoken':$( "#csrfmiddlewaretoken" ).val()
},
success: function(data){
alert(data);
}
});
</script>
还有另一个捷径。 我不知道这里的安全问题是否具有如此大的价值和重要性。 我遇到了这个问题,但似乎有很多黑客攻击,最终试图从现有 cookie 提交 csrftoken。 我不知道如果这个 cookie 不存在或没有设置会发生什么。
我的方法是在处理 ajax 帖子的视图中添加一个@csrf_exempt
。 您从django.views.decorators.csrf
导入csrf_exempt
像这样:
from django.views.decorators.csrf import csrf_exempt
然后,从视图方法:
@csrf_exempt
def the_method_to_be_called(request):
...
看到这个链接
我的解决方案是将其作为对具有此内容的 js 文件的引用:
jQuery(document).ajaxSend(function(event, 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;
}
function sameOrigin(url) {
// url could be relative or scheme relative or absolute
var host = document.location.host; // host + port
var protocol = document.location.protocol;
var sr_origin = '//' + host;
var origin = protocol + sr_origin;
// Allow absolute or scheme relative URLs to same origin
return (url == origin || url.slice(0, origin.length + 1) == origin + '/') ||
(url == sr_origin || url.slice(0, sr_origin.length + 1) == sr_origin + '/') ||
// or any other URL that isn't scheme relative or absolute i.e relative.
!(/^(\/\/|http:|https:).*/.test(url));
}
function safeMethod(method) {
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
if (!safeMethod(settings.type) && sameOrigin(settings.url)) {
xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
}
});
我已经通过执行以下操作来解决它:
let data = {};
data.somedata = somedata;
data.csrfmiddlewaretoken = '{{ csrf_token }}';
$.ajax({
type: 'POST',
url: "/myadmin/user/medical/"+rowId,
data: data,
dataType: "json",
success: function(resultData) { alert("Save Complete") }
});
希望这对某人有用。
请在您的 js 中添加 csrfmiddlewaretoken 作为csrfmiddlewaretoken
: {% csrf_token %}
。
<script type="text/javascript">
$.ajax({
type:"POST",
url:"{% url DrHub.views.ajxTest %}",
data: {
'start': $('#id_startTime').val(),
'end': $('#id_endTime').val(),
'csrfmiddlewaretoken': '{% csrf_token %}'
},
success: function(data){
alert(data);
}
});
</script>
在 HTML(模板)中
{% csrf_token %}
在JS中
$.ajax({
type: "POST",
url: '/brand-admin/publish_article/',
data: {
'article_id': article_id,
'csrfmiddlewaretoken':$( "input[name='csrfmiddlewaretoken']" ).val()
},
dataType: 'json',
success: function (data) {
console.log(data);
}
});
如果{% csrf_token %}
在您的模板中:
<form id="the-form" autocomplete="off">
{% csrf_token %}
<input type="text" name="q">
<input type="submit" value="Submit">
</form>
您应该能够使用以下方法发送它:
$("#the-form").submit(function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: "/post-url",
data: $("#the-form").serialize(),
success: function(data){
console.log(data);
}
});
});
最简单的方法: csrfmiddlewaretoken
将在 dom 元素中可用。
只需使用名称从 dom 元素中获取csrfmiddlewaretoken
,如下所示:
'csrfmiddlewaretoken': $("input[name=csrfmiddlewaretoken]").val()
您也可以通过 id 获取它,但有时那个 dom 元素不会是 carrieng id,所以这是最好的方法。
您可以复制粘贴以下代码:
$.ajax({
type:"POST",
url:"{% url DrHub.views.ajxTest %}",
data: {
'start': $('#id_startTime').val(),
'end': $('#id_endTime').val(),
'csrfmiddlewaretoken': $("input[name=csrfmiddlewaretoken]").val()
},
success: function(data){
alert(data);
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.