禁止（CSRF 令牌丢失或不正确。）：/u/submit答案

【问题标题】：Forbidden (CSRF token missing or incorrect.): /u/submit禁止（CSRF 令牌丢失或不正确。）：/u/submit
【发布时间】：2018-07-22 15:37:28
【问题描述】：

views.py

def form(request):
    if request.method == 'POST':
        form = StudentForm(request.POST)
        if form.is_valid():
            form.save()
            return HttpResponse('done')
    else:
        form = StudentForm()
    return render(request,'submit.html',{'form':form})

urls.py

urlpatterns = [
    path('submit',views.form, name = 'submit')
]

模板/html

<!DOCTYPE html>
{% load staticfiles %}
<html lang="en">
<head>
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
   </script>

    <script src="{% static 'js/ajax2.js' %}" type="text/javascript"></script>
</head>


<body>

<form class="form_ajax" method="post" data-url="/submit" >
    {% csrf_token %}
    {{ form }}
    <button id="btn" type="submit">Submit</button>
</form>
</body>

ajax2.js

$(document).ready(function(){
    $('#btn').click(function(event){
        event.preventDefault()
        var name = $('#id_name').val();
        var marks = $('#id_marks').val();
        var year = $('#id_year').val();
        csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val()

        $.ajax({
            url :'/u/submit',
            type: 'POST',
            data :{'name':name,'marks':marks,'year':year},
            success : function(data){
                console.log(data);
                alert('created:',data);
            },
        });
    });
});

它显示 Forbidden (CSRF token missing or incorrect.): /u/submit 。因此我尝试用不同的方法来做 js

$(document).ready(function(){
    $('#btn').click(function(event){
        event.preventDefault()
        var myForm = $('.ajax_form');
        var formData = myForm.serialize();
        var thisUrl = myForm.attr('data-url') || window.location.href;



        $.ajax({
            url :thisUrl,
            type: 'POST',
            data :formData,
            success : function(data){
                console.log(data);
                alert('created:',data);
            },
        });
    });
});

但它正在播种相同的 403 错误，但正如您所见，我以 html 形式给出了csrf_token。但仍然给出错误。即使在 ajax 中提供 csrf 中间件令牌，它现在仍然可以工作..我做错了什么?

【问题讨论】：

您的表单类是 .form_ajax 但您通过 .ajax_form 访问它

标签： python ajax django

【解决方案1】：

在您的 jquery ajax 调用中添加 csrf 令牌标头，如下所示：

$(document).ready(function(){
    $('#btn').click(function(event){
        event.preventDefault()
        var myForm = $('.ajax_form');
        var formData = myForm.serialize();
        var thisUrl = myForm.attr('data-url') || window.location.href;

       let csrfcookie = function() {
            let cookieValue = null,
                name = "csrftoken";
            if (document.cookie && document.cookie !== "") {
                let cookies = document.cookie.split(";");
                for (let i = 0; i < cookies.length; i++) {
                    let cookie = cookies[i].trim();
                    if (cookie.substring(0, name.length + 1) == (name + "=")) {
                        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                        break;
                    }
                }
            }
            return cookieValue;
        };

        $.ajax({
            url :thisUrl,
            type: 'POST',
            beforeSend: function(request, settings) {
                        if (!(/^http:.*/.test(settings.url) || /^https:.*/.test(settings.url))) {
                            request.setRequestHeader("X-CSRFToken", csrfcookie());
                        }
                    },
            data :formData,
            success : function(data){
                console.log(data);
                alert('created:',data);
            },
        });
    });
});

【讨论】：