Javascript 表内操作按钮中表示无效CSRF令牌

Javascript 表内操作按钮中表示无效CSRF令牌,javascript,node.js,express,handlebars.js,csrf,Javascript,Node.js,Express,Handlebars.js,Csrf,车把每个环上的CSRF令牌出现问题。我用每个循环生成了一个数据表,但我不能提交删除按钮。CSRF仅处理提交新数据(POST)和提交更新数据(PUT)。以下是我的设置: app.js Route item.js 我的看法是: <h2 class="page-header">Data Items</h2> <div class="row"> <div class="col-md-4"> <a href="/item/add

车把
每个环上的CSRF令牌出现问题
。我用
每个循环生成了一个数据表
,但我不能提交
删除
按钮。CSRF仅处理提交新数据(POST)和提交更新数据(PUT)。以下是我的设置:

app.js

Route item.js

我的看法是:

<h2 class="page-header">Data Items</h2>
<div class="row">
    <div class="col-md-4">
        <a href="/item/add" class="btn btn-primary pull-left">
            <i class="fa fa-plus" aria-hidden="true">&nbsp;New Item</i>
        </a>
    </div>
    <div class="col-md-4 col-md-offset-4">
        <div class="input-group">
            <input type="text" class="form-control" id="searchItem" onkeyup="searchTableItem()" placeholder="Search item name..">
            <div class="input-group-addon"><span><i class="fa fa-search" aria-hidden="true"></i></span></div>
        </div>
    </div>

</div>    
<div class="table-responsive no-padding" id="itemList">
        <table class="table table-hover table-striped" id="myTable">
            <thead>
                <th>No.</th>
                <th>Item ID</th>
                <th>Item Name</th>
                <th>Descriptions</th>
                <th>Stock</th>
                <th>Action</th>
            </thead>
            <tbody>
                {{#each items as |item key|}}
                <tr>
                    <td>{{ counter @key }}</td>
                    <td>{{ item.item_id }}</td>
                    <td>{{ item.item_name }}</td>
                    <td>{{ item.description }}</td>
                    <td>{{ item.stock }}</td>
                    <td>
                        <div style="display:inline-block; margin-right:5px;">
                            <a href="/item/details/{{item._id}}" class="btn btn-primary btn-xs">
                                <i class="glyphicon glyphicon-eye-open"></i>
                            </a>
                        </div>
                        <div style="display:inline-block; margin-right:5px;">
                            <a class="btn btn-success btn-xs" href="/item/edit/{{item._id}}">
                                <i class="glyphicon glyphicon-pencil"></i>
                            </a>
                        </div>
                        <div style="display:inline-block; margin-right:5px;">
                            <form action="/item/delete/{{item._id}}" method="post">
                                <input type="hidden" name="_csrf" value="{{ csrfToken }}">
                                <input type="hidden" name="_method" value="DELETE">
                                <button class="btn btn-danger btn-xs" type="submit">
                                    <i class="glyphicon glyphicon-trash"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
               {{/each }}
            </tbody>
        </table>
    </div>
数据项
不
项目ID
项目名称
描述
股票
行动
{{{#每个项目作为|项目键}
{{counter@key}}
{{item.item_id}
{{item.item_name}
{{item.description}}
{{item.stock}
{{/每个}}

我已经为
csrfToken
添加了隐藏的输入字段,但它不起作用,每次单击“删除”按钮时,它总是显示
invalid csrf token
。我不知道为什么循环内无法访问令牌,但如果我在循环外打印
csrfToken
,它会工作,页面上打印的令牌。

您的csrfToken当前被传递为“。。。。没有什么。为了解决这个问题而不是{{csrfToken}},请在{../csrfToken}中键入


回答编辑原因:找到了更简单的解决方案。

您的csrfToken当前被传递为“。。。。没有什么。为了解决这个问题而不是{{csrfToken}},请在{../csrfToken}中键入


答案编辑原因:更容易找到解决方案。

我有相同的问题:(我有相同的问题:(
    var express = require('express');
    var router = express.Router();
    /*CSRF protection*/
    var csrf = require('csurf');
    var csrfProtection = csrf();
    router.use(csrfProtection);

    var Item = require('../models/item/item');

    /* GET items listing */
    router.get('/', isLoggedIn, function(req, res, next) {
        session_store = req.user.username;
        Item.find({}, function (err, item) {
            if (err) return console.error(err, res);
            res.render('item/index', {items: item, csrfToken: req.csrfToken()});
        }).select('item_id item_name description stock image_path');
    });

    /* Delete item by ID*/
    router.delete('/delete/:id', isLoggedIn, function (req, res, next) {
        Item.findById(req.params.id, function (err, item) {
            item.remove(function (err, item) {
                if(err) return console.error(res, err);
                console.log('DELETE removing ID: ' + item._id);
                res.redirect('/item');
            });
        });
    });
<h2 class="page-header">Data Items</h2>
<div class="row">
    <div class="col-md-4">
        <a href="/item/add" class="btn btn-primary pull-left">
            <i class="fa fa-plus" aria-hidden="true">&nbsp;New Item</i>
        </a>
    </div>
    <div class="col-md-4 col-md-offset-4">
        <div class="input-group">
            <input type="text" class="form-control" id="searchItem" onkeyup="searchTableItem()" placeholder="Search item name..">
            <div class="input-group-addon"><span><i class="fa fa-search" aria-hidden="true"></i></span></div>
        </div>
    </div>

</div>    
<div class="table-responsive no-padding" id="itemList">
        <table class="table table-hover table-striped" id="myTable">
            <thead>
                <th>No.</th>
                <th>Item ID</th>
                <th>Item Name</th>
                <th>Descriptions</th>
                <th>Stock</th>
                <th>Action</th>
            </thead>
            <tbody>
                {{#each items as |item key|}}
                <tr>
                    <td>{{ counter @key }}</td>
                    <td>{{ item.item_id }}</td>
                    <td>{{ item.item_name }}</td>
                    <td>{{ item.description }}</td>
                    <td>{{ item.stock }}</td>
                    <td>
                        <div style="display:inline-block; margin-right:5px;">
                            <a href="/item/details/{{item._id}}" class="btn btn-primary btn-xs">
                                <i class="glyphicon glyphicon-eye-open"></i>
                            </a>
                        </div>
                        <div style="display:inline-block; margin-right:5px;">
                            <a class="btn btn-success btn-xs" href="/item/edit/{{item._id}}">
                                <i class="glyphicon glyphicon-pencil"></i>
                            </a>
                        </div>
                        <div style="display:inline-block; margin-right:5px;">
                            <form action="/item/delete/{{item._id}}" method="post">
                                <input type="hidden" name="_csrf" value="{{ csrfToken }}">
                                <input type="hidden" name="_method" value="DELETE">
                                <button class="btn btn-danger btn-xs" type="submit">
                                    <i class="glyphicon glyphicon-trash"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
               {{/each }}
            </tbody>
        </table>
    </div>