KendoUI Grid使用SignalR数据源触发read参数不匹配错误如何解决

错误诱因 #

该报错的核心原因是Kendo UI DataSource的默认配置和服务端Hub方法定义不匹配，偶发特性和你的标签页延迟初始化逻辑相关：

1. Kendo UI DataSource 默认开启serverFiltering、serverSorting、serverPaging三个配置项，即便你预期过滤仅作用于本地数据集，只要在dataSource中定义了filter规则，Kendo的SignalR传输层会自动将过滤、排序等请求参数打包为单个对象，作为入参调用服务端Hub的Read方法。你当前服务端Read方法定义为无参，参数数量不匹配就会触发该异常。
2. 偶发的原因是标签页触发初始化时，存在概率性的$('#global_user_identifier')未完成赋值的情况，此时filter规则未生效，Kendo不会生成请求参数，无参调用Read方法就不会触发报错，因此故障表现为偶发。

存在的配置问题 #

1. 未显式关闭服务器端操作：你预期过滤仅在本地生效，需要手动关闭服务器端操作开关，否则Kendo默认会将所有数据操作参数传递到服务端。
2. Hub方法未兼容Kendo请求参数：如果后续需要使用服务器端过滤、排序能力，需要给Read方法添加对应参数接收Kendo传递的请求对象。

修复方案 #

方案1（适配本地过滤需求，推荐你当前场景使用） #

在dataSource配置中显式关闭服务器端操作即可，修改grid.js的dataSource配置：

dataSource: {
    error: function (e) {
        console.log(e)                    
    },
    // 新增以下三个配置，关闭服务器端操作
    serverFiltering: false,
    serverSorting: false,
    serverPaging: false,
    filter: {
        logic: "and",
        filters: [
            {
                field: "Created_User",
                operator: "eq",
                value: $('#global_user_identifier').val()
            },
            {
                field: "Completed",
                operator: "eq",
                value: 0
            }
        ]
    },
    // 其余原有配置保持不变
}

同时可以优化服务端Read方法，直接返回序列化安全的List避免IQueryable延迟加载问题：

public List<ToDo> Read()
{
    return _userTodo.GetAll().ToList();
}

方案2（适配服务器端操作需求，后续需要性能优化时可使用） #

如果数据量较大需要服务端处理过滤、排序，修改TodoHub.cs的Read方法：

using Kendo.Mvc.UI;
using Kendo.Mvc.Extensions;

public DataSourceResult Read([DataSourceRequest] DataSourceRequest request)
{
    IQueryable<ToDo> data = _userTodo.GetAll();
    return data.ToDataSourceResult(request);
}

额外优化建议 #

可以在标签页初始化逻辑中增加SignalR连接状态判断，避免连接未就绪时初始化Grid失败：

if (!instance_grid_todo) {
    if(todo_hub.state !== signalR.HubConnectionState.Connected){
        await todo_hub_start;
    }
    await load_grid_todo();
}

内容的提问来源于stack exchange，提问作者Yanayaya