带有 JSON.Stringify 的 ASP.NET Core 2.2 AntiForgeryToken答案

【问题标题】：ASP.NET Core 2.2 AntiForgeryToken with JSON.Stringify带有 JSON.Stringify 的 ASP.NET Core 2.2 AntiForgeryToken
【发布时间】：2019-01-29 15:07:47
【问题描述】：

我的服务器上有这个控制器，它有一个ValidateAntiForgeryToken 属性

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult GetHistory([FromBody] ChatMessageGetHistoryViewModel Input)
{
     var userName = HttpContext.User.Claims.Where(c => c.Type == "UserName").Select(c => c.Value).SingleOrDefault();
     var history = chatMessageData.GetAllBySessionId(Input.SessionId, userName);
     var output = JsonConvert.SerializeObject(history);
     return Ok(output);
}

我已经尝试过这种方法，但到目前为止，我一直收到错误代码 400。我尝试将 antiforgery 令牌作为表单数据的一部分包含在内，但这也不起作用。

<script>
    $(document).ready(function () {
        var token = $('input[name="__RequestVerificationToken"]', $('#__AjaxAntiForgeryForm')).val();
        var SessionId = document.getElementById("Id").value;
        var form_data = {
            "SessionId": SessionId,
            __RequestVerificationToken: token,
        };
        $.ajax({
            url: "@Url.Action("GetHistory", @ViewContext.RouteData.Values["controller"].ToString())",
            method: "POST",
            data: JSON.stringify(form_data),
            contentType: "application/json",
            success: function (result) {
                console.log(result);
                var output = JSON.parse(result);
                for (var i = 0; i < output.length; i++) {
                    var p = document.createElement("span");
                    var q = document.createElement("li");
                    if (output[i].Mine == true) {
                        p.setAttribute("class", "Sender Me");
                        q.setAttribute("class", "Message");
                    } else {
                        p.setAttribute("class", "Sender");
                        q.setAttribute("class", "Message");
                    }
                    p.textContent = output[i].Name + " - " + moment(output[i].CreatedOn).format("DD-MM-YYYY HH:mm:ss");
                    q.textContent = output[i].Message;
                    document.getElementById("MessageList").appendChild(p);
                    document.getElementById("MessageList").appendChild(q);
                }

            },
            error: function (error) {
                console.log(error);
            }
        });

        $('#MessageList').stop().animate({
            scrollTop: $('#MessageList')[0].scrollHeight
        }, 2000);
        return false;
    });
</script>

【问题讨论】：

标签： javascript jquery asp.net asp.net-core

【解决方案1】：

您必须将RequestVerificationToken 传递为header 和ajax 请求，如下所示：

$.ajax({
        url: "@Url.Action("GetHistory", @ViewContext.RouteData.Values["controller"].ToString())",
        method: "POST",
        data: JSON.stringify(form_data),
        contentType: "application/json",
        headers: { 'RequestVerificationToken': token }, // here have to set the token
        success: function (result) {
            console.log(result);
            var output = JSON.parse(result);
            for (var i = 0; i < output.length; i++) {
                var p = document.createElement("span");
                var q = document.createElement("li");
                if (output[i].Mine == true) {
                    p.setAttribute("class", "Sender Me");
                    q.setAttribute("class", "Message");
                } else {
                    p.setAttribute("class", "Sender");
                    q.setAttribute("class", "Message");
                }
                p.textContent = output[i].Name + " - " + moment(output[i].CreatedOn).format("DD-MM-YYYY HH:mm:ss");
                q.textContent = output[i].Message;
                document.getElementById("MessageList").appendChild(p);
                document.getElementById("MessageList").appendChild(q);
            }

        },
        error: function (error) {
            console.log(error);
        }
    });

【讨论】：

【解决方案2】：

对于 AJAX 请求，您需要在请求标头中设置令牌：RequestVerificationToken 请求标头，具体而言，默认情况下。

$.ajax({
    ...
    headers: {
        'RequestVerificationToken': token
    }
});

【讨论】：