Django csrf_token 以一种形式工作，但不以其他形式工作

Question

我有一个包含两个列表的页面：任务 (tareas) 和销售 (ventas)。当您单击他们的链接时，每个人都会打开自己的模式并使用 AJAX.

检索信息

一个工作没有问题（tareas）。另一个给我一个 csrf_token 错误。

我认为可能是在同一个模板中使用两个标记有问题，但我在其他模板中使用没有问题。

如果我完全删除 tareas 部分，ventas 仍然会出现同样的错误。

Venta 表单调用

<form name="ventas_form" action="#" id="form_venta_{{operacion.comprobante}}" method="POST">
    {% csrf_token %}
    <input name="id" id="venta_id_submit" type="text" value="{{operacion.comprobante}}" hidden="true"/>
    <a style="padding-left: 1rem;" href="" id="{{operacion.comprobante}}" class="show_venta" data-toggle="modal" >{{operacion.comprobante}}</a>
</form>

Tarea 表单调用

<form name="form" action="#" id="form_tarea_{{tarea.id}}" method="POST">
    {% csrf_token %}
    <input name="id" id="tarea_id_submit" type="text" value="{{tarea.id}}" hidden="true"/>
    <a style="padding-left: 1rem;" href="" id="{{tarea.id}}" class="show_tarea" data-toggle="modal" >{{ tarea.titulo }}</a>
</form>

文塔Ajax

<script>
   $(function(){
        $('.show_venta').on('click', function (e) {
            e.preventDefault();
            let venta_id = $(this).attr('id');

            $.ajax({
                url:'/catalog/ventas-detail/',
                type:'POST',
                data: $('#form_venta_'+venta_id).serialize(),
                success:function(response){
                    console.log(response);
                    $('.show_venta').trigger("reset");
                    openModalVentas(response);
                },
                error:function(){
                    console.log('something went wrong here');
                },
            });
        });
    });

    function openModalVentas(venta_data){
        $('#fecha').text(venta_data.venta.fecha);
        $('#comprobante').text(venta_data.venta.comprobante);
        $('#cliente').text(venta_data.venta.cliente);
        $('#vendedor').text(venta_data.venta.vendedor);
        $('#lista').text(venta_data.venta.lista);
        $('#prod_codigo').text(venta_data.venta.prod_codigo);
        $('#prod_nombre').text(venta_data.venta.prod_nombre);
        $('#uds').text(venta_data.venta.uds);
        $('#vu').text(venta_data.venta.vu);
        $('#subtotal').text(venta_data.venta.subtotal);
        $('#bonif').text(venta_data.venta.bonif);
        $('#modal_ventas').modal('show');
    };
</script>

面积Ajax

<script>
   $(function(){
        $('.show_tarea').on('click', function (e) {
            e.preventDefault();
            let tarea_id = $(this).attr('id');

            $.ajax({
                url:'/catalog/tareas-detail/',
                type:'POST',
                data: $('#form_tarea_'+tarea_id).serialize(),
                success:function(response){
                    console.log(response);
                    $('.show_tarea').trigger("reset");
                    openModal(response);
                },
                error:function(){
                    console.log('something went wrong here');
                },
            });
        });
    });

    function openModal(tarea_data){
        $('#creador').text(tarea_data.tarea.creador);
        $('#destinatario').text(tarea_data.tarea.destinatario);
        $('#titulo').text(tarea_data.tarea.titulo);
        $('#tarea').text(tarea_data.tarea.tarea);
        $('#resuelto').text(tarea_data.tarea.resuelto);
        $('#fecha_creacion').text(tarea_data.tarea.fecha_creacion);
        $('#fecha_limite').text(tarea_data.tarea.fecha_limite);
        $('#fecha_resuelto').text(tarea_data.tarea.fecha_resuelto);
        $('#empresa').text(tarea_data.tarea.empresa);
        $('#persona_empresa').text(tarea_data.tarea.persona_empresa);
        $('#modal_tareas').modal('show');
    };
</script>

文塔视图

def VentaDetailView(request):
    ID = request.POST.get('id')
    ventas_todas = Ventas.objects.filter(pk=ID).get()

    venta = {
        "fecha": ventas_todas.fecha,
        "comprobante": ventas_todas.comprobante,
        "cliente": ventas_todas.cliente,
        "vendedor": ventas_todas.vendedor.nombre,
        "lista": ventas_todas.lista,
        "prod_codigo": ventas_todas.prod_codigo,
        "prod_nombre": ventas_todas.prod_nombre,
        "uds": ventas_todas.uds,
        "vu": ventas_todas.vu,
        "subtotal": ventas_todas.subtotal,
        "bonif": ventas_todas.bonif,
    }

    return JsonResponse({'venta': venta})

区域视图

def TareaDetailView(request):
    ID = request.POST.get('id')

    tarea_select = Tareas.objects.filter(pk=ID).get()

    tarea = {
        "creador": tarea_select.creador.username,
        "destinatario": tarea_select.destinatario.username,
        "titulo": tarea_select.titulo,
        "tarea": tarea_select.tarea,
        "resuelto": tarea_select.resuelto,
        "fecha_creacion": tarea_select.fecha_creacion,
        "fecha_limite": tarea_select.fecha_limite,
        "fecha_resuelto": tarea_select.fecha_resuelto,
        "empresa": tarea_select.empresa.Nombre,
        "persona_empresa": tarea_select.persona_empresa.nombre,
    }

    return JsonResponse({'tarea': tarea})

Answer 1

不知道为什么 tareas 部分有效...但我肯定会在两个 ajax 调用中添加 'X-CSRFToken' header：

$.ajax({
    url:'/catalog/ventas-detail/',
    type:'POST',
    data: $('#form_venta_'+venta_id).serialize(),
    headers: {'X-CSRFToken': getCookie('csrftoken')}
    ...
});

其中：

function getCookie(name) {
    var value = '; ' + document.cookie,
        parts = value.split('; ' + name + '=');
    if (parts.length == 2) return parts.pop().split(';').shift();
}

Answer 2

您也可以像那样将 CSRF 令牌添加到 header :

$.ajaxSetup({
    beforeSend: function(xhr, settings) {
        xhr.setRequestHeader("X-CSRFToken",  getCookie('csrftoken'));
    }
});

那么您就不需要手动将 CSRF 令牌添加到所有 ajax 请求中。

Django csrf_token 以一种形式工作，但不以其他形式工作

Django csrf_token works in one form but not in other

django

ajax

csrf-token