javascript - 在 Jtable (Jquery) 中删除操作时将 csrf 标记设置为 post 参数

Question

您好，我正在尝试在帖子中添加 csrf token ，同时删除 jtable 中的记录，它不起作用，但 listAction 和 updateAction 工作正常。

我的代码片段:-

$(document).ready(function () {
    $('#main-content').jtable({
        title: ' Data',
        selecting: true, //Enable selecting
        multiselect: true, //Allow multiple selecting
        selectingCheckboxes: true, //Show checkboxes on first column
        paging: true, //Enable paging
        pageSize: 10, //Set page size (default: 10)           
        actions: {
            listAction:"${pageContext.request.contextPath}/mycontroller/all"  ,
           // createAction:"${pageContext.request.contextPath}/mycontroller/create",
            updateAction:"${pageContext.request.contextPath}/mycontroller/edit",
            deleteAction:"${pageContext.request.contextPath}/mycontroller/delete"
        },
        fields: {
            code: {
                title:'Code',
                width: '25%',
                 key: true,

                edit:true,
                input: function (data) {
                    if (data.value) {
                        return '<input type="text" readonly class="jtable-input-readonly" name="code" value="' + data.value + '"/>';
                    }
                },

              },
            name: {
                title: 'Name',
                width: '25%',
                create:true,
                edit:true
            },
            craetedTs: {
                title: 'Created',
                width: '25%',
                edit:false
            },


            modifiedTs: {
                title: 'mdate',
                width: '25%',
                edit:true,
                input: function (data) {
                     if (data.value) {
                         mdate='';

                         var date = new Date();
                         var options = {
                             year: "numeric", month: "2-digit",
                             day: "2-digit", hour: "2-digit", minute: "2-digit" ,second:"2-digit"
                         };
                        today=date.toLocaleTimeString("en-us", options);
                        today=today.replace(',', '');
                      return '<input type="text" readonly class="jtable-input-readonly" name="modifiedTs" value="' + today + '"/>';
                     }
                } 
            },
             _csrf: {
                  visibility: 'hidden',
                  edit:true,
                  input: function (data) {
                      return '<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}" />';

                   }
            }

        }

    });
     $('#main-content').jtable('load',{'${_csrf.parameterName}' : '${_csrf.token}'});

  //Delete selected 
    $('#DeactiveID').button().click(function () {
           var $selectedRows = $('#main-content').jtable('selectedRows');
           $('#main-content').jtable('deleteRows', $selectedRows);
       });

});

我什至尝试删除下面的代码:-

deleteAction: function (postData) {
    return $.Deferred(function ($dfd) {
        $.ajax({
            url: '/Demo/DeleteStudent',
            type: 'POST',
            dataType: 'json',
            data: '${_csrf.parameterName}' + "=" +'${_csrf.token}' ,
            success: function (data) {
                $dfd.resolve(data);
            },
            error: function () {
                $dfd.reject();
            }
        });
    });
}

但是当我检查删除操作 url 时，整个方法都在反射(reflect)

Answer 1

将元元素添加到您从中调用 ajax 方法的页面

<meta name="_csrf" content="${_csrf.token}"/>
<meta name="_csrf_header" content="${_csrf.headerName}"/>

并对您的 deleteAction 进行此更改

deleteAction: function (postData) {
    return $.Deferred(function ($dfd) {

var token = $("meta[name='_csrf']").attr("content");
var header = $("meta[name='_csrf_header']").attr("content");
        $.ajax({
            url: '/Demo/DeleteStudent',
            type: 'POST',
            dataType: 'json',
            beforeSend: function (request)
                {
                    request.setRequestHeader(header, token);
                },
            success: function (data) {
                $dfd.resolve(data);
            },
            error: function () {
                $dfd.reject();
            }
        });
    });
}