使用 Razor 页面在 ASP.NET Core MVC 中使用处理程序设置 Kendo UI Grid DataSource Read 属性

Bla*_*ell 2 c# kendo-ui-mvc kendo-ui-grid asp.net-core razor-pages

我正在使用带有 Razor Pages Web 应用程序的 ASP.NET Core MVC 套件的 Kendo UI,因此我尝试将处理程序技术用于网格的服务器操作。

@(Html.Kendo().Grid<CustomerViewModel>()
        .Name("CustomersGrid")
        .Columns(columns =>
        {
            columns.Bound(x => x.CustomerId).Title("Student ID");
            columns.Bound(x => x.CustomerName).Title("Name");
        })
        .Pageable()
        .Sortable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(20)
            .ServerOperation(true)
            .Read(read => read.Url("/Customers?handler=Read")))
         )
Run Code Online (Sandbox Code Playgroud)

我查看了网络选项卡,它正在向http://localhost:5000/Customers?handler=Read发出正确的 POST但是我没有在断点处结束,我得到了一个状态代码 400。

在剃刀页面的 Action 方法后面的代码中,它被命名为 OnPostReadAsync

知道为什么这不起作用吗?除了 .Url 之外,还尝试在 DataSource 的 .Read 属性中使用 read.Action 和 read.Route。

这是带有 action 方法的类:

public class IndexModel : PageModel
{
    private readonly ICustomerRepository _customerRepository;
    private readonly IMapper _mapper;

    public IndexModel(ICustomerRepository customerRepository, IMapper mapper)
    {
        _customerRepository = customerRepository;
        _mapper = mapper;
    }

    public IList<CustomerViewModel> Customers { get; set; }

    public async Task<IActionResult> OnPostReadAsync([DataSourceRequest] DataSourceRequest request)
    {
        // THIS IS WHERE I WANT IT TO GO FOR READ

        var customersFromDb = await _customerRepository.FilterAsync();
        return new JsonResult(_mapper.Map<IList<Customer>, IList<CustomerViewModel>>(customersFromDb).ToDataSourceResult(request));
    }
}
Run Code Online (Sandbox Code Playgroud)

crg*_*den 5

您可能已经这样做了,但我没有在您的代码中看到它。请记住,Razor Pages 需要防伪令牌。你可以像这样将它注入到你的标记中:

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
Run Code Online (Sandbox Code Playgroud)

我添加了这个函数来根据网格的dataSource请求设置它:

$(function () {
    const requestVerificationToken = '@Xsrf.GetAndStoreTokens(HttpContext).RequestToken';
    const beforeSend = req => req.setRequestHeader('RequestVerificationToken', requestVerificationToken);
    const grid = $("#grid").getKendoGrid();
    grid.dataSource.transport.options.create.beforeSend = beforeSend;
    grid.dataSource.transport.options.update.beforeSend = beforeSend;
    grid.dataSource.transport.options.destroy.beforeSend = beforeSend;
});
Run Code Online (Sandbox Code Playgroud)

如果没有该令牌,所有PageModel自定义处理程序都将返回 400 错误。

参考:在 ASP.NET Core 中防止跨站请求伪造 (XSRF/CSRF) 攻击