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"> 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"> 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>