使用 ASP.NET 核心和 JQuery 启用防伪令牌

Question

我正在使用 JQuery 和 ASP.NET Core 1.0.1，我有 Ajax 调用：

$("#send-message").on("submit", function (event) {
  event.preventDefault();
  var $form = $(this);   
  $.ajax({
    url: "api/messages",
    data: JSON.stringify($form.serializeToJSON()),
    dataType: "json",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json"
    },
    type: "post"
  })
  .done(function (data, status, xhr) { })
  .fail(function (xhr, status, error) { });

到ASP.NET核心动作：

[HttpPost("messages")]
public async Task<IActionResult> Post([FromBody]MessagePostApiModelModel model) {
   // Send message
}

表单位于共享视图中，如下所示：

<form id="send-question" method="post">
  <textarea name="content"></textarea>
  <button class="button" type="submit">Enviar</button>
</form>

当我提交表单时出现错误：

Microsoft.AspNetCore.Antiforgery.AntiforgeryValidationException: The required antiforgery header value "RequestVerificationToken" is not present.

如何通过 JQuery Ajax 调用启用 ASP.NET Core 的 AntiForgeryToken？

更新

我需要在表格中添加以下 asp-controller 和 asp-action:

<form asp-controller="QuestionApi" asp-action="Post" id="send-question" method="post">
</form>

这将生成防伪令牌。我需要手动将令牌添加到 JQuery 调用的 headers 中，如下所示：

  headers: {
    "Accept": "application/json",
    "Content-Type": "application/json",
    "RequestVerificationToken": $form.find("input[name='af_token']").val()
  },

有更好的方法吗？

当没有表单并且我只有一个 A 标签时如何解决这个问题，当点击它时会发出 Ajax 调用？我可以在我的页面头部生成一个通用的防伪标记以供来自该页面的所有 ajax 调用使用吗？

Answer 1

您可以注册一个全局 ajax 事件，该事件会将 header 添加到所有 ajax 调用，但不是 GET 方法：

$(document).ajaxSend(function(e, xhr, options) {
    if (options.type.toUpperCase() != "GET") {
        xhr.setRequestHeader("RequestVerificationToken", token);
    }
});

Answer 2

mode777 的答案只需要一个小的补充就可以完成这项工作（我试过了）：

$(document).ajaxSend(function(e, xhr, options) {
    if (options.type.toUpperCase() == "POST") {
        var token = $form.find("input[name='af_token']").val();
        xhr.setRequestHeader("RequestVerificationToken", token);
    }
});

实际上，如果您也使用 Ajax 提交，则根本不需要使用表单。把这个放在你的 _layout:

 <span class="AntiForge"> @Html.AntiForgeryToken() </span>

然后通过将此添加到您的 javascript:

来获取令牌

$(document)
   .ajaxSend(function (event, jqxhr, settings) {
        if (settings.type.toUpperCase() != "POST") return;
        jqxhr.setRequestHeader('RequestVerificationToken', $(".AntiForge" + " input").val())
})

@HtmlAntiForgeryToken 生成一个带有防伪令牌的隐藏输入字段，与使用表单时相同。上面的代码使用 class select 或 select 范围找到它，然后获取其中的输入字段以收集令牌并将其添加为 header.

Answer 3

注意：此答案适用于 ASP.NET Core 2.0。它可能不适合旧版本。

下面是我在研究了 aspnet 的源代码一段时间后所做的：

public static class HttpContextExtensions
{
    public static string GetAntiforgeryToken(this HttpContext httpContext)
    {
        var antiforgery = (IAntiforgery)httpContext.RequestServices.GetService(typeof(IAntiforgery));
        var tokenSet = antiforgery.GetAndStoreTokens(httpContext);
        string fieldName = tokenSet.FormFieldName;
        string requestToken = tokenSet.RequestToken;
        return requestToken;
    }
}

您可以在这样的视图中使用它：

<script>
    var data = {
        yourData: "bla",
        "__RequestVerificationToken": "@Context.GetAntiforgeryToken()"
    };
    $.post("@Url.Action("ActionName")", data);
</script>

您也可以将扩展方法修改为 return 字段名称，以您希望的任何形式，例如。 G。一个 JSON 片段。

Answer 4

除了 ygoe's answer 之外，如果您想将 XSRF 令牌作为 header 传递，例如X-XSRF-Token:

var ajax = {
    url: "/users",
    data: data,
    type: "post",

    // ...
};

var antiForgeryToken = $("input[name=__RequestVerificationToken]").val();
if (antiForgeryToken) {
    ajax.headers = {};
    ajax.headers["X-XSRF-Token"] = antiForgeryToken;
};

$.ajax(ajax);

那么您还需要指定相应的防伪选项：

public void ConfigureServices(IServiceCollection services)
{
    // your services to inject are also configured here ...

    services.AddAntiforgery(options => options.HeaderName = "X-XSRF-Token");
    services.AddMvc();
}

然后您可以使用标准 ValidateAntiForgeryToken 属性来验证请求：

[HttpPost]
[ValidateAntiForgeryToken]
public JsonResult Users(UserModel user)
{
    // ...
}

Answer 5

在Asp.Net Core中可以直接请求token，as documented:

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf    
@functions{
    public string GetAntiXsrfRequestToken()
    {
        return Xsrf.GetAndStoreTokens(Context).RequestToken;
    }
}

并在javascript中使用：

function DoSomething(id) {
    $.post("/something/todo/"+id,
               { "__RequestVerificationToken": '@GetAntiXsrfRequestToken()' });
}

您可以添加推荐的全局过滤器，as documented:

services.AddMvc(options =>
{
    options.Filters.Add(new AutoValidateAntiforgeryTokenAttribute());
})

使用 ASP.NET 核心和 JQuery 启用防伪令牌

Enable Antiforgery Token with ASP.NET Core and JQuery

ajax

jquery

antiforgerytoken

asp.net-core