带有 Ajax 的 AntiForgery Token MVC - JavaScript

在许多 ASP.NET MVC 应用程序中，我们都需要在 AJAX 调用中使用 AntiForgeryToken。这确保我们的应用程序不受 CSRF（跨站请求伪造）攻击的威胁。本文将介绍在AJAX调用中使用带有防伪标记的MVC应用程序。

Step 1 - 添加 AntiForgery Token 到视图文件

在使用 AJAX 发送 POST 请求时，需要在请求中添加 AntiForgeryToken。因此，我们首先需要将 AntiForgeryToken 添加到我们的视图文件中，例如：

@using (Html.BeginForm("Action", "Controller"))
{
    @Html.AntiForgeryToken()

    <!-- other form fields here -->
    <input type="submit" value="Submit" />
}

注意，我们为整个表单添加了 @Html.AntiForgeryToken()，并使用标准 HTML 表单元素 input 来提交表单。

Step 2 - 将 AntiForgery Token 添加到 Ajax 请求

我们需要在 AJAX 请求中显式地添加 AntiForgeryToken。这可以通过以下两个步骤完成。

将 AntiForgery Token 添加到 JavaScript

我们可以使用以下 JavaScript 代码将 AntiForgeryToken 添加到我们的 AJAX 请求中：

function getAntiForgeryToken() {
    var token = $('input[name="__RequestVerificationToken"]').val();
    var tokenValuePair = { "__RequestVerificationToken": token };
    return tokenValuePair;
}

请注意，此代码查找一个名为 "__RequestVerificationToken" 的隐藏字段，并提取该字段的值作为我们的 Token。如果您的 AntiForgeryToken 名称不同，则需要更改此代码以反映当前 Token 名称。

将 AntiForgery Token 添加到 AJAX 请求

除了 JavaScript 代码之外，我们还需要在我们的 AJAX 请求中添加 AntiForgeryToken。以下是一个例子：

function makeAjaxRequest() {
    $.ajax({
        type: "POST",
        url: "@Url.Action("Action", "Controller")",
        data: {
            // other form fields go here
            "__RequestVerificationToken": getAntiForgeryToken().__RequestVerificationToken
        },
        success: function (response) {
            // handle success
        },
        error: function (error) {
            // handle error
        }
    });
}

在 AJAX 请求中，我们将 AntiForgery Token 添加到 data 参数中，以便将其提交给服务器。

讨论

在本文中，我们学习了如何在 AJAX 调用中使用带有防伪标记的 MVC 应用程序。我们首先在视图文件中添加了 AntiForgeryToken，然后使用 JavaScript 代码将其添加到 AJAX 请求中。这确保了我们的应用程序不受 CSRF 攻击的威胁。

参考资料

• ASP.NET MVC 5 防伪