我正在使用快速中间件csurf进行CSRF保护 . 如果我将它与表单一起使用,我将令牌放入隐藏字段,路由背后的操作就可以了 . 现在我想做一个简单的AJAX调用,但csurf说它无效 .
AJAX call:
$('.remove').on('click', function () {
var csrf = $(this).attr('data-csrf');
$.ajax({
type: 'DELETE',
url: '/user/' + $(this).attr('data-id'),
data: {
_csrf: csrf
},
success: function (data) {
//.....
}
});
});
而视图中的部分:
<td class="uk-table-middle">
<button data-id="{{ _id }}" data-csrf="{{ csrfToken }}" class="uk-button-link uk-text-large remove">
<i class="uk-icon-remove"></i>
</button>
</td>
而来自中间件的init:
import * as csurf from 'csurf';
// init bodyparse and and and...
app.use(csurf());
2 回答
我不知道在express中,但通常CSRF令牌在cookie中,所以你需要这两个函数:
然后:
或者如果您不想使用jQuery,可以使用XMLHttpRequest来发出AJAX请求:
此方法不起作用的唯一原因是您没有使用ajax请求传递cookie . 当我查看代码时,当我弄清楚时,我很挣扎 .
Csurf需要您传递存储在cookie上的密钥(
_csrf
) . Cookie通过基于域的权限(您的服务器允许CORS除外)有限制在我的情况下,我使用
fetch
传递具有相同域请求的cookie(我不必允许CORS)请注意上面的代码我使用的是es6格式 . 如果您要求使用不同的域,则可以使用
include
更改same-origin
a.k.a CORS see the doc here如果您使用
jQuery
作为库,此代码可能对您有用 . 此代码未经测试,您应该根据您使用的库自行查找 .传递
_csrf
值时,请在 headers , post data 或 querystring 上自由使用您自己的名称 . 在上面的示例中,我使用名称为x-csrf-token
的标头,但您可以使用基于下面的屏幕截图代码的其他方法 .