本文详细阐述了如何通过jquery ajax向asp.net mvc控制器正确发送数组或列表类型的数据，并解决常见的“415 unsupported media type”错误。核心在于客户端需将数据序列化为json字符串并设置正确的`contenttype`，同时服务器端控制器方法需使用`[httppost]`和`[frombody]`属性来正确接收和反序列化数据。
理解AJAX发送复杂数据与415错误
在Web开发中，经常需要通过AJAX将客户端收集到的复杂数据结构（如对象数组或列表）发送到服务器端进行处理。当尝试使用jQuery AJAX发送此类数据到ASP.NET MVC控制器时，如果配置不当，可能会遇到“415 Unsupported Media Type”错误。这个错误表明服务器无法理解客户端发送的数据格式，因为它期望的是某种特定类型（通常是JSON），但接收到的数据格式不符合预期。
产生415错误的主要原因通常是客户端没有正确地将JavaScript对象序列化为服务器可以识别的格式（如JSON字符串），并且/或者没有在HTTP请求头中正确声明Content-Type。
客户端数据准备与发送
要成功发送一个JavaScript对象数组到服务器，需要确保以下两点：
数据序列化： 将JavaScript数组对象转换为JSON字符串。内容类型声明： 告知服务器发送的数据是JSON格式。
以下是使用jQuery AJAX发送数组的正确方法：
$(function(){ $("#btnSave").click(function(){ var datos = new Array(); // 遍历HTML表格行，收集数据并构建JavaScript对象数组 $("#imgCurrent tr").each(function () { var row = $(this); var id = row.find("td:eq(0)").text(); // 获取第一列的文本作为ID var data = { RepositoryCatalogueID: id }; datos.push(data); }); var url = "@Url.Action("EditPosition","Carrusel")"; // 获取控制器Action的URL $.ajax({ url: url, type: 'POST', contentType: 'application/json; charset=utf-8', // 关键：声明发送的数据是JSON格式 dataType: 'json', // 期望服务器返回的数据类型 data: JSON.stringify(datos), // 关键：将JavaScript数组序列化为JSON字符串 success: function (data) { // 请求成功后的处理 $.alert({ icon: "~/Content/Images/success.png", title: 'Restaurar Imagen', content: 'Restauración exitosa.', }); }, error: function(xhr, status, error) { // 错误处理 console.error("AJAX Error:", status, error); console.error("Response Text:", xhr.responseText); $.alert({ icon: "~/Content/Images/error.png", title: '错误', content: '操作失败：' + error, }); } }); });});
关键点解析：
JSON.stringify(datos)：这是将JavaScript datos数组（包含多个对象）转换为标准的JSON字符串的关键步骤。服务器端才能将其解析为对应的C#对象列表。contentType: ‘application/json; charset=utf-8’：此设置告诉服务器，请求体中的数据是JSON格式。服务器会根据这个Content-Type头来选择合适的媒体类型格式化器进行处理。原代码中的contentType: ‘json’是不规范且错误的写法，应使用’application/json’。dataType: ‘json’：虽然不是解决415错误的核心，但它指示jQuery期望从服务器接收JSON格式的响应，这是一种良好的实践。
服务器端控制器接收数据
在ASP.NET MVC控制器中，为了正确接收客户端发送的JSON数据并将其绑定到C#对象列表，需要做以下配置：
using System.Collections.Generic;using System.Web.Mvc; // 确保引入了正确的命名空间// 定义ViewModel，与客户端发送的数据结构对应public class CarruselViewModel{ public int RepositoryCatalogueID { get; set; } // 可以添加其他属性}public class CarruselController : Controller{ [HttpPost] // 确保此Action方法只响应HTTP POST请求 public JsonResult EditPosition([FromBody] IEnumerable model) { bool success = false; string message = string.Empty; if (model != null) { // 在这里处理接收到的模型数据 foreach (var item in model) { // 例如：保存到数据库 // Console.WriteLine($"Received ID: {item.RepositoryCatalogueID}"); } success = true; message = "数据接收成功！"; } else { message = "未接收到有效数据。"; } // 返回JSON结果 return Json(new { success = success, message = message }, JsonRequestBehavior.AllowGet); }}
关键点解析：
[HttpPost]属性：明确指定此Action方法只能通过HTTP POST请求访问。如果客户端发送的是GET请求，将无法匹配此方法。[FromBody]属性：这是ASP.NET MVC（或Web API）中一个非常重要的属性。它指示框架应尝试从HTTP请求的主体中读取数据，并将其反序列化为IEnumerable类型的对象。当客户端发送Content-Type: application/json且数据为JSON字符串时，[FromBody]会与内置的JSON媒体类型格式化器协同工作，将JSON字符串解析为C#对象。
总结与注意事项
要成功通过jQuery AJAX发送数组/列表数据到ASP.NET MVC控制器并避免415错误，核心在于客户端和服务器端的协同：
客户端（jQuery AJAX）：使用JSON.stringify()将JavaScript对象数组转换为JSON字符串。设置contentType: ‘application/json; charset=utf-8’以正确声明数据类型。服务器端（ASP.NET MVC）：在控制器Action方法上添加[HttpPost]属性。在接收复杂类型参数（如IEnumerable）前添加[FromBody]属性。确保ViewModel的属性名称与客户端发送的JSON数据中的键名完全匹配（区分大小写，尽管在某些配置下可能不区分）。
遵循这些步骤，将能够稳定可靠地在客户端和服务器之间传输复杂的数据结构。如果仍然遇到问题，请检查浏览器开发者工具中的网络请求，确认请求头和请求体是否符合上述要求，并检查服务器端日志以获取更详细的错误信息。
以上就是使用jQuery AJAX发送数组/列表数据并解决415错误的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1588975.html
微信扫一扫 
支付宝扫一扫 
