Django post 请求 + jquery 库

Question

我正在尝试在 Django 项目中使用 jquery 处理 ajax POST 请求。

但是我遇到了一个没有具体消息的错误。

我认为下面的一些列表是假设有错误原因的。

不包含在POST请求数据中的CSRF-TOKEN

在我的 javascript 代码中，jquery 的 $.click() 方法不起作用。

（但实际上 $.mouseover() 方法是有效的。）

$('#input-submit').click(function() {
    console.log("before post request!!!");
    $.post("/add_to_cart", {
        product_id : $(this).attr('pro-id'),
        quantity : $('#input-quan').val()
    }, function(event) {
        console.log("success post request!!!");
    }, function(error){
            console.log("error!!")
    });
});

shops/static/js/script.js

我的表单元素的用法是错误的。

<form action="{% url 'shops:add_to_cart' %}" method="post">
    {% csrf_token %}
    <input type="text" id="input-quan">
    <input type="submit" id="input-submit" pro-id="{{product.id}}" value="{{product.id}}">
</form>

shops/template/shops/product_detail.html

此外，这是额外的代码。

def add_to_cart(request):
    quantity = request.POST.get('quantity')
    product_id = request.POST.get('product_id')

    return HttpResponse(json.dumps({       
        "product_id" : product_id,
        "quantity" : quantity,
    }),content_type="application/json")

    # output >>> {"product_id":null, "quantity":null}

shops/views.py

url(r'^detail/(?P<product_id>[0-9]+)$', views.product_detail, name="detail"),
url(r'^detail/add_to_cart$', views.add_to_cart, name="add_to_cart"),
url(r'^cart$', views.cart, name="cart"),
url(r'^cart/del_from_cart$', views.del_from_cart, name="del_from_cart"),

shops/urls.py

虽然传递给 django-view 的参数很简单，但我想使用 POST 请求。

我使用的是 django-1.7 版本。

请帮帮我。

Answer 1

CSRF 在 Django 中默认激活，所以为了将它与 jquery ajax 请求一起使用：

在您的 JS 文件中：

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;
}
var csrftoken = getCookie('csrftoken');

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", csrftoken);
        }
    }
});

以上将在您的请求中添加 CSRF，这是 Django 在您使用 POST 时所期望的。您可以在官方文档中找到更多信息： https://docs.djangoproject.com/en/1.7/ref/contrib/csrf/

Django post 请求 + jquery 库

Django post request + jquery library

django

ajax

jquery

post