jQuery Ajax 调用和 Html.AntiForgeryToken() [英] jQuery Ajax calls and the Html.AntiForgeryToken()

问题描述

我在我的应用程序中实施了缓解CSRF攻击的措施，遵循以下信息我在互联网上阅读了一些博客文章.特别是这些帖子一直是我实现的驱动力

I have implemented in my app the mitigation to CSRF attacks following the informations that I have read on some blog post around the internet. In particular these post have been the driver of my implementation

• ASP.NET MVC 最佳实践，来自 ASP.NET 和 Web 工具开发人员内容团队
• 剖析跨站请求伪造攻击来自 Phil Haack 博客
• ASP.NET MVC 框架中的 AntiForgeryToken - Html.AntiForgeryToken 和 ValidateAntiForgeryToken 属性来自 David Hayden 博客

• Best Practices for ASP.NET MVC from the ASP.NET and Web Tools Developer Content Team
• Anatomy of a Cross-site Request Forgery Attack from Phil Haack blog
• AntiForgeryToken in the ASP.NET MVC Framework - Html.AntiForgeryToken and ValidateAntiForgeryToken Attribute from David Hayden blog

基本上那些文章和建议说，为了防止 CSRF 攻击，任何人都应该实现以下代码:

Basically those articles and recommendations says that to prevent the CSRF attack anybody should implement the following code:

1. 在接受 POST Http 动词的每个动作上添加 [ValidateAntiForgeryToken]

[HttpPost][验证AntiForgeryToken]公共 ActionResult SomeAction(SomeModel 模型){}

[HttpPost] [ValidateAntiForgeryToken] public ActionResult SomeAction( SomeModel model ) { }

在向服务器提交数据的表单中添加 <%= Html.AntiForgeryToken() %> 助手

Add the <%= Html.AntiForgeryToken() %> helper inside forms that submits data to the server

无论如何，在我的应用程序的某些部分，我正在使用 jQuery 向服务器执行 Ajax POST，而根本没有任何形式.例如，我让用户单击图像以执行特定操作时会发生这种情况.

Anyway in some parts of my app I am doing Ajax POSTs with jQuery to the server without having any form at all. This happens for example where I am letting the user to click on an image to do a specific action.

假设我有一个包含活动列表的表格.我在表格的一列上有一张图片，上面写着将活动标记为已完成"；当用户单击该活动时，我正在执行 Ajax POST，如下例所示:

Suppose I have a table with a list of activities. I have an image on a column of the table that says "Mark activity as completed" and when the user click on that activity I am doing the Ajax POST as in the following sample:

$("a.markAsDone").click(function (event) {
    event.preventDefault();
    $.ajax({
        type: "post",
        dataType: "html",
        url: $(this).attr("rel"),
        data: {},
        success: function (response) {
            // ....
        }
    });
});

在这些情况下，我如何使用 <%= Html.AntiForgeryToken() %>?我应该在 Ajax 调用的数据参数中包含辅助调用吗?

How can I use the <%= Html.AntiForgeryToken() %> in these cases? Should I include the helper call inside the data parameter of the Ajax call?

抱歉发了这么长的帖子，非常感谢您的帮助

Sorry for the long post and thanks very much for helping out

编辑:

根据 jayrdub 回答我用过通过以下方式

As per jayrdub answer I have used in the following way

$("a.markAsDone").click(function (event) {
    event.preventDefault();
    $.ajax({
        type: "post",
        dataType: "html",
        url: $(this).attr("rel"),
        data: {
            AddAntiForgeryToken({}),
            id: parseInt($(this).attr("title"))
        },
        success: function (response) {
            // ....
        }
    });
});

推荐答案

我使用一个简单的 js 函数是这样的

I use a simple js function like this

AddAntiForgeryToken = function(data) {
    data.__RequestVerificationToken = $('#__AjaxAntiForgeryForm input[name=__RequestVerificationToken]').val();
    return data;
};

由于页面上的每个表单都具有相同的令牌值，因此只需在最顶层的母版页中放置类似的内容

Since every form on a page will have the same value for the token, just put something like this in your top-most master page

<%-- used for ajax in AddAntiForgeryToken() --%>
<form id="__AjaxAntiForgeryForm" action="#" method="post"><%= Html.AntiForgeryToken()%></form>  

然后在您的 ajax 调用中执行(编辑以匹配您的第二个示例)

Then in your ajax call do (edited to match your second example)

$.ajax({
    type: "post",
    dataType: "html",
    url: $(this).attr("rel"),
    data: AddAntiForgeryToken({ id: parseInt($(this).attr("title")) }),
    success: function (response) {
        // ....
    }
});

这篇关于jQuery Ajax 调用和 Html.AntiForgeryToken()的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！