ASP.NET MVC中Ajax POST JSON对象时AntiforgeryToken致参数为空求助
我来帮你排查这个问题,你遇到的参数为空的情况主要是因为请求数据的格式和后端期望的不匹配,还有AntiForgeryToken的传递方式需要调整,咱们一步步来修正:
问题根源分析
你之前的代码存在两个核心问题:
- 请求数据格式混乱:同时混合了表单键值对和JSON序列化对象,导致MVC的模型绑定无法正确解析参数
- 参数层级不匹配:你把ViewModel包裹在了
questionnaireVM对象里,但后端Action期望直接接收QuestionnaireViewModel类型的实例
方案一:使用JSON格式提交(推荐)
这种方式需要统一用JSON格式传递数据,并把AntiForgeryToken放在请求头中:
修正后的前端JS代码
$('#submitBtn').on('click', function () { // 直接构建与后端ViewModel结构一致的对象,不需要额外包裹 var questionnaireVM = { 'QuestionnaireId': $('#QuestionnaireId').val(), 'Revision': $('#Revision').val(), 'IPAddress': '' }; // 获取AntiForgeryToken var token = $('input[name="__RequestVerificationToken"]').val(); $.ajax({ type: "POST", url: "./PostQuestionnaire", data: JSON.stringify(questionnaireVM), // 直接序列化ViewModel对象 contentType: "application/json; charset=utf-8", // 必须指定JSON格式 headers: { '__RequestVerificationToken': token // Token放入请求头 }, success: function (result) { result.success ? console.log("success") : console.log("fail"); }, error: function () { console.log("error"); } }); });
后端代码保持不变(确保ViewModel属性可访问)
[HttpPost] [ValidateAntiForgeryToken] public ActionResult PostQuestionnaire(QuestionnaireViewModel questionnaireViewModel) { // 你的业务逻辑代码 }
方案二:使用表单格式提交
如果更倾向于传统表单提交方式,也可以用FormData来构建请求数据:
$('#submitBtn').on('click', function () { var formData = new FormData(); // 添加AntiForgeryToken formData.append('__RequestVerificationToken', $('input[name="__RequestVerificationToken"]').val()); // 添加ViewModel的各个属性 formData.append('QuestionnaireId', $('#QuestionnaireId').val()); formData.append('Revision', $('#Revision').val()); formData.append('IPAddress', ''); $.ajax({ type: "POST", url: "./PostQuestionnaire", data: formData, processData: false, // 禁止jQuery自动处理数据 contentType: false, // 让浏览器自动设置正确的Content-Type success: function (result) { result.success ? console.log("success") : console.log("fail"); }, error: function () { console.log("error"); } }); });
额外注意事项
- 确保
QuestionnaireViewModel的所有属性都是public,并且带有getter和setter - 检查前端输入框的ID是否与JS中获取值的选择器完全匹配(比如
#QuestionnaireId是否对应正确的输入框) - 可以通过浏览器开发者工具的「网络」标签,查看请求的Payload和Headers,确认数据是否正确发送
内容的提问来源于stack exchange,提问作者Eugeniusz Borodzicz
相关产品推荐
相关产品推荐

