AJAX发送数组到ASP.NET控制器:解决415错误及数据绑定指南


AJAX发送数组到ASP.NET控制器:解决415错误及数据绑定指南

本文深入探讨在使用jquery ajax向asp.net控制器发送数组或复杂对象时常见的415错误。我们将详细介绍客户端如何通过`json.stringify()`方法正确序列化数据,并设置正确的`content-type`。同时,也会讲解服务器端控制器如何使用`[httppost]`和`[frombody]`属性来接收和绑定这些数据,确保数据传输的顺畅与成功,避免unsupported media type错误。

在使用jQuery AJAX向ASP.NET(无论是MVC还是Core)控制器发送复杂数据类型,尤其是对象数组时,开发者常会遇到415 Unsupported Media Type错误。这通常意味着客户端发送的数据格式与服务器端期望接收的格式不匹配。本教程将详细解释如何正确配置客户端AJAX请求和服务器端控制器动作方法,以实现数组数据的顺畅传输和绑定。

理解415错误的原因

当服务器响应415 Unsupported Media Type错误时,它表明请求的Content-Type头部指示的实体主体格式不被目标资源支持。在AJAX场景中,即使您在$.ajax请求中设置了contentType: 'json',如果data参数不是一个JSON字符串,jQuery会尝试将其转换为application/x-www-form-urlencoded格式发送,或者服务器在接收到Content-Type: application/json头部时,却发现请求体内容并非有效的JSON字符串,从而导致解析失败。

客户端AJAX请求的正确配置

要成功发送数组或复杂对象到服务器,关键在于两点:

  1. 数据序列化: 必须将J*aScript对象或数组显式地序列化为JSON字符串。
  2. 内容类型声明: 告知服务器发送的数据是JSON格式。

以下是修正后的jQuery AJAX代码示例:

$(function(){
    $("#btnS*e").click(function(){         

        var datos = new Array();

        $("#imgCurrent tr").each(function () {
            var row = $(this);

            var id = row.find("td:eq(0)").text(); // 获取第一列的文本作为ID

            var data = {
                RepositoryCatalogueID: id
            };

            datos.push(data);
        });    

        // 定义控制器动作的URL
        var url = "@Url.Action("EditPosition","Carrusel")"; 

        $.ajax({
            url: url,
            type: 'POST',
            // 明确指定Content-Type为application/json
            contentType: 'application/json; charset=utf-8', 
            // 关键:使用JSON.stringify()将J*aScript数组转换为JSON字符串
            data: JSON.stringify(datos), 
            success: function (response) {
                // 请求成功的回调
                $.alert({
                    icon: "~/Content/Images/success.png",
                    title: '操作成功',
                    content: '数据保存成功。',
                });
            },
            error: function (xhr, status, error) {
                // 请求失败的回调,可用于调试
                console.error("AJAX请求失败: " + status + ", " + error);
                $.alert({
                    icon: "~/Content/Images/error.png",
                    title: '操作失败',
                    content: '数据保存失败,请重试。',
                });
            }
        });
    });
});

关键点说明:

  • contentType: 'application/json; charset=utf-8':这是标准的JSON内容类型声明。charset=utf-8确保了字符编码的正确性。
  • data: JSON.stringify(datos):这是解决415错误的核心。JSON.stringify()方法将J*aScript的datos数组(包含对象)转换成一个符合JSON格式的字符串。服务器端才能正确解析这个字符串为JSON对象。

服务器端控制器方法的正确配置

在ASP.NET控制器中,为了正确接收和绑定客户端发送的JSON数组,需要确保以下两点:

即梦AI 即梦AI

一站式AI创作平台,免费AI图片和视频生成。

即梦AI 16094 查看详情 即梦AI
  1. HTTP方法匹配: 动作方法必须使用[HttpPost]属性来响应POST请求。
  2. 模型绑定: 使用[FromBody]属性指示ASP.NET从请求体中解析数据并绑定到模型。

以下是修正后的ASP.NET控制器动作方法示例:

using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc; // 或 System.Web.Mvc; 对于ASP.NET MVC 5

// 定义与客户端数据结构匹配的ViewModel
public class CarruselViewModel
{
    public int RepositoryCatalogueID { get; set; }
    // 可以根据需要添加其他属性
}

[ApiController] // 对于ASP.NET Core API,通常会添加此属性
[Route("Carrusel")] // 定义控制器路由前缀
public class CarruselController : ControllerBase // 或 Controller
{
    [HttpPost] // 明确指定此方法只响应HTTP POST请求
    [Route("EditPosition")] // 定义动作方法的路由
    public JsonResult EditPosition([FromBody] IEnumerable<CarruselViewModel> 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 new JsonResult(new { success = success, message = message });
    }
}

关键点说明:

  • [HttpPost]:确保此动作方法仅响应HTTP POST请求。如果客户端发送的是GET请求,或者没有此属性,请求可能无法匹配到正确的动作。
  • [FromBody] IEnumerable model:
    • [FromBody]属性告诉ASP.NET的Model Binder,它应该从请求的HTTP主体中读取数据,并尝试将其反序列化为IEnumerable类型的对象集合。
    • IEnumerable:服务器端模型类型必须与客户端发送的JSON数组结构相匹配。CarruselViewModel的属性名称(例如RepositoryCatalogueID)应与客户端JSON对象中的键名一致(大小写通常不敏感,但建议保持一致)。

总结与注意事项

通过以上客户端和服务器端的正确配置,您将能够成功地使用jQuery AJAX发送数组或复杂对象到ASP.NET控制器,并避免415 Unsupported Media Type错误。

核心要点回顾:

  1. 客户端: 始终使用JSON.stringify()将J*aScript对象或数组序列化为JSON字符串,并设置contentType: 'application/json; charset=utf-8'。
  2. 服务器端: 对于POST请求,使用[HttpPost]属性。对于从请求体中接收复杂数据,使用[FromBody]属性,并确保模型类型与客户端发送的JSON结构相匹配。
  3. 调试技巧:
    • 使用浏览器开发者工具(Network标签页)检查AJAX请求的Request Headers(特别是Content-Type)和Request Payload(查看发送的实际数据)。
    • 在服务器端控制器动作方法中设置断点,检查model参数是否正确接收到数据。
    • 检查服务器日志,可能会有更详细的错误信息。

遵循这些指南,可以有效解决AJAX数据传输中的415错误,并实现客户端与服务器端之间复杂数据的可靠交换。

以上就是AJAX发送数组到ASP.NET控制器:解决415错误及数据绑定指南的详细内容,更多请关注其它相关文章!


# 第三方  # 平头哥seo  # 网页seo优化推广  # 驿城区企业推广营销中心  # 小餐饮门店营销推广  # 市场推广营销图文  # 广州专业的网站优化  # 株洲企业SEO优化费用  # 莱阳哪家网站建设好  # 百度快照网站优化哪家好  # 2024年网站关键词实时排名  # 相匹配  # 自适应  # 全选  # 回调  # 转换为  # javascript  # 双击  # 这是  # 绑定  # 客户端  # microso  # 路由  # 工具  # app  # 浏览器  # 编码  # ajax  # json  # js  # jquery  # java 


相关栏目: 【 Google疑问12 】 【 Facebook疑问10 】 【 优化推广96088 】 【 技术知识133117 】 【 IDC资讯59369 】 【 网络运营7196 】 【 IT资讯61894


相关推荐: J*a列表元素格式化输出教程  创建您的便携版VS Code:让配置随身携带  J*aScript:从子元素中批量移除特定CSS类  《KARDS》冬季扩展包“国土阵线”上线!全新“协力”机制改变战场格局  Python模块化编程:避免循环导入与共享函数的最佳实践  C#解析来自网络的XML流数据 实时错误处理与重试机制  可米酷漫画在线阅读入口_ 可米酷漫画官网直达链接  《随手记》备份数据方法  使用CSS :has() 选择器实现父元素样式控制:从子元素反向应用样式  学习通网页版个人登录_学习通网页版个人账户登录入口  《sketchbook》选中部分图案移动方法  如何外贸网站设计-能留住客户提升用户体验!  Animex动漫社正版在线入口 Animex动漫社动漫官方观看网  《下一站江湖2》独孤剑诀习得方法  如何修改Windows截图的默认保存位置_告别C盘让桌面更整洁【教程】  Microsoft Edge网页字体太淡看不清怎么办_Microsoft Edge字体渲染优化技巧  店铺如何做视频号推广?做视频号推广有用吗?  Win11如何分屏操作_Win11多窗口分屏技巧  优化 WooCommerce 产品价格显示与自定义短代码集成  mysql触发器如何编写_mysql触发器编写规范与代码示例讲解  电脑视频号|直播|如何分享屏幕  b站如何管理订阅_b站订阅标签分类管理  Cassandra中复合主键、二级索引与ORDER BY排序的限制与解决方案  手机远程连接电脑方法  MacBook Pro词典使用指南  漫蛙漫画官方网站使用_漫蛙manwa网页版在线入口教程  三星M34录音变声问题_Samsung M34麦克风调整  Mac hosts文件在哪里_Mac修改hosts文件详细教程  Win10如何关闭操作中心通知 Win10免打扰设置全攻略【清爽】  J*aScript实现下拉菜单驱动的动态表格数据展示  Python中安全地将环境变量转换为整数的类型注解指南  VS Code源代码管理(SCM)视图的进阶使用技巧  百度小说看书时如何翻页_百度小说手动翻页与自动翻页设置  抖音视频如何添加标题?添加标题有哪些好处?  todesk如何添加信任设备_todesk信任设备设置教程  多闪APP官方下载安装入口_多闪最新版本获取入口  荣耀 Magic10 Pro 系统更新提示失败_荣耀 Magic10 Pro 升级修复  Excel怎么用XLOOKUP函数实现双向查找_ExcelXLOOKUP替代VLOOKUP+HLOOKUP的高级用法  PHP odbc_fetch_array 返回值处理:如何正确访问嵌套数组元素  以下哪一项是古代兵书三十六计中的计谋  如何取消数字签名  TikTok网页版入口快速访问 TikTok官网账号登录方法  Lar*el 中高效执行多列更新:单次查询实现  J*a中导出MySQL表为SQL脚本的两种方法  C++如何使用CMake构建项目_C++ CMakeLists.txt编写入门教程  优化Google Charts Gauge:在数据库无数据时显示默认值  支付宝网页版在线入口 支付宝官网电脑登录入口  英雄联盟争者留名活动介绍  鸣潮历史学家灯塔位置一览  海棠阅读登录教程_详细讲解海棠登录操作 

 2025-10-25

了解您产品搜索量及市场趋势,制定营销计划

同行竞争及网站分析保障您的广告效果

点击免费数据支持

提交您的需求,1小时内享受我们的专业解答。

运城市盐湖区信雨科技有限公司


运城市盐湖区信雨科技有限公司

运城市盐湖区信雨科技有限公司是一家深耕海外推广领域十年的专业服务商,作为谷歌推广与Facebook广告全球合作伙伴,聚焦外贸企业出海痛点,以数字化营销为核心,提供一站式海外营销解决方案。公司凭借十年行业沉淀与平台官方资源加持,打破传统外贸获客壁垒,助力企业高效开拓全球市场,成为中小企业出海的可靠合作伙伴。

 8156699

 13765294890

 8156699@qq.com

Notice

We and selected third parties use cookies or similar technologies for technical purposes and, with your consent, for other purposes as specified in the cookie policy.
You can consent to the use of such technologies by closing this notice, by interacting with any link or button outside of this notice or by continuing to browse otherwise.