Question

我正在尝试jquery ajax调用以从Razor页面检索用户列表。

Users.cshtml.cs页面：

public ActionResult OnPostList(string FirstName, string LastName,string IsActive)
{
        var data=(from s in _db.SecurityUser
                 where s.FirstName.Contains(FirstName) && s.LastName.Contains(LastName) && (IsActive=="" || (IsActive =="Y" && s.IsActive==true) || (IsActive == "N" && s.IsActive == false))
                 select s).OrderBy(s=>s.FirstName);
        return new JsonResult(data);
}

JS Call：

$.ajax({
    type: "POST",
    url: "/Security/Users?handler=List",
    data: JSON.stringify({
        FirstName: $("#txtFirstName").val(),
        LastName: $("#txtLastName").val(),
        IsActive: $("#ddActive").val()
    }),
    contentType: "application/json",
    dataType: "json",
    success: function (response) {
        var d = response.d;
        var tblBody = $("#tblUsers > tbody");
        tblBody.empty();
        $.each(d, function (i, item) {
            var modifiedDate = new Date(parseInt(item.ModifiedDate.substr(6)));
            var $tr = $('<tr>').append(
                $('<td>').html("<a href='javascript:void(0)' onclick='fnDialogShow(" + item.UserID + ")'>Edit</a>"),
                $('<td>').text(item.FirstName),
                $('<td>').text(item.LastName),
                $('<td>').text(item.IsActive ? "Yes" : "No")
            ).appendTo(tblBody);

        });
    },
    failure: function (response) {
        alert(response.d);
    }

});

当它调用时我得到400错误。试图找出我做错了什么。

Answer 1

您对Ajax请求的URL格式是否正确。需要注意的一点是，Razor Pages旨在保护（CSRF / XSRF）攻击。因此，Antiforgery令牌生成和验证将自动包含在Razor Pages中。我相信这就是问题所在。如果您的HTML中有表单标记，则您的页面可能会在页面上显示防伪令牌。但是你需要在Ajax请求中传递相同的内容。

首先，使用@Html.AntiForgeryToken()添加防伪令牌（如果不存在）。

然后，修改您的Ajax请求以在请求标头中发送相同的内容。

像，

＆＃13;

beforeSend: function (xhr) {
       xhr.setRequestHeader("XSRF-TOKEN",
          $('input:hidden[name="__RequestVerificationToken"]').val());
},

＆＃13;

阅读这篇文章Handle Ajax Requests in ASP.NET Core Razor Pages，了解有关使用ASP.NET Core razor页面发出ajax请求的更多信息。

Answer 2

默认情况下，Razor Pages旨在保护CSRF攻击。

您必须正确地将防伪令牌注入您的ajax请求。

See the Documentation.

在ASP.NET Core 2.0中，它看起来像这样......

首先将此代码放入剃刀视图的顶部：

// At the top of your page
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@functions{
    public string GetAntiXsrfRequestToken()
    {
        return Xsrf.GetAndStoreTokens(Context).RequestToken;
    }
}

然后在你的ajax请求中，设置标记头。

$.ajax({
    type: "post",
    headers: {
        "RequestVerificationToken": '@GetAntiXsrfRequestToken()'
    },
    url: '@Url.Action("Antiforgery", "Home")',
    success: function (result) {
        alert(result);
    },
    error: function (err, scnd) {
        alert(err.statusText);
    }
});

Answer 3

使用HttpPost属性标记您的OnPostList并将ajax调用中的URL更改为/ Security / OnPostList

Answer 4

在行动中添加<body> <h2 id='visual-progress'>Quiz Progress</h2> <progress id='progress-bar' max='100' value='0'></progress> <button id='btn'>Next</button> </body>

[HttpPost]

在[HttpPost] public ActionResult OnPostList(string FirstName, string LastName,string IsActive) { var data=(from s in _db.SecurityUser where s.FirstName.Contains(FirstName) && s.LastName.Contains(LastName) && (IsActive=="" || (IsActive =="Y" && s.IsActive==true) || (IsActive == "N" && s.IsActive == false)) select s).OrderBy(s=>s.FirstName); return new JsonResult(data); }

中使用此Script

Users.cshtml.cs

Answer 5

我使用$ .ajax遇到了不好的经历，我使用了$ .post。我使用了validateAntiforgeryToken，但没有必要

    $("#emailSubmit").click(function () {

        $.post("/Projects/SendInvite",
            {
                Email: $("#email").val(),
                Message: $("#message").val(),
                __RequestVerificationToken: $('input[name="__RequestVerificationToken"]').val()
            }

        )
        return false;

    });

这是净核心行动：

    [HttpPost]
    [ValidateAntiForgeryToken]
    public IActionResult SendInvite(string Email, string Message)
{

        //MailTest();
        var json = new List<string>
        {
        Email,
        Message
        };
        return new JsonResult(json);
   }

Answer 6

对于.net core 2.1，此博客中的解决方案有所帮助 https://www.thereformedprogrammer.net/asp-net-core-razor-pages-how-to-implement-ajax-requests/

如果页面不包含带有方法post的表单，请添加防伪令牌@Html.AntiForgeryToken()

您可以开始触发Ajax请求，重要的是在此处设置 headers 。

$.ajax({
                type: "POST",
                url: "/Customers?handler=Delete",
                data: { id: id },
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                // AntiforgeryToken is required by RazorPages
                headers: {
                    RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val()
                }
            })
            .done(function () {
                alert("success");
            })
            .fail(function () { 
                alert("error");
            });

Asp.net Core 2.0 Razor Pages Ajax Post

6 个答案: