SpringMVC 通过ajax 前后端数据交互

在前端的开发过程中,经常在html页面通过ajax进行前后端数据的交互,SpringMVC的controller进行数据的接收,但是有的时候后端会出现数据无法接收到的情况,这个是因为我们的参数和前端ajax的contentType参数 类型不对应的情景,或者说contentType和后台controller 方法参数到底存在什么样的关系

普通的参数我们传递的时候往往是这样的两种情况:

contentType: "application/x-www-form-urlencoded",
contentType: "application/json",

这样的两种方式有什么样的区别,

第一种方式:application/x-www-form-urlencoded 参数会解析为参数表,比如:

  • name=John+Doe&age=30&city=New+York
    

 通过ajax 传递,ajax写法如下:

           	let params={"username":"张三","password":"123456",}$.ajax({url: "dologin4",contentType: "application/x-www-form-urlencoded",headers: {  'Authorization': "****",'Access-Control-Allow-Origin':'*'},type: 'post',data: params,success: function(result) {console.log(result)},error: function(data) {console.log('接口不通');}});

这样的形式,后台接受的时候,使用:request.getParameter()@RequestParam,比如:

	@RequestMapping("/dologin")public ModelAndView dologin(@RequestParam String username,@RequestParam String password) throws Exception {System.out.println(username);System.out.println(password);ModelAndView mav = new ModelAndView();mav.addObject("info", "欢迎你");mav.setViewName("success");return mav;}@ResponseBody@RequestMapping("/dologin2")public Map<String,Object> dologin2(HttpServletRequest request,HttpServletResponse response) throws Exception {String username=request.getParameter("username");System.out.println(username);Map<String,Object> map=new HashMap<>();map.put("aa", "1111");return map;}

 

适合 x-www-form-urlencoded 的情况:

  • 传统HTML表单提交

  • 简单的键值对数据

  • 需要向后兼容老系统

  • 文件上传(结合multipart/form-data

第二种方式:contentType: "application/json", 整个body作为单一数据流处理,比如:

{"name": "John Doe","age": 30,"city": "New York","hobbies": ["reading", "swimming"]
}

通过ajax 传递,ajax写法如下:

           function dologin(){let params={"username":"张三","password":"123456",}$.ajax({url: "dologin4",contentType: "application/json",headers: {  'Authorization': "****",'Access-Control-Allow-Origin':'*'},type: 'post',data: JSON.stringify(params),success: function(result) {console.log(result)},error: function(data) {console.log('接口不通');}});}

Java后台接受前台传入参数的代码如下:@RequestBody

	@ResponseBody@RequestMapping("/dologin4")public Map<String,Object> dologin4(HttpServletRequest request,HttpServletResponse response) throws Exception {String uu=request.getParameter("username");System.out.println(uu);StringBuilder jsonBuilder = new StringBuilder();try (BufferedReader reader = request.getReader()) {String line;while ((line = reader.readLine()) != null) {jsonBuilder.append(line);}}String jsonString = jsonBuilder.toString();ObjectMapper mapper = new ObjectMapper();Map<String, Object> jsonMap = mapper.readValue(jsonString, Map.class);  String username = (String) jsonMap.get("username");System.out.println(username);Map<String,Object> map=new HashMap<>();map.put("aa", "1111");return map;   }@ResponseBody@RequestMapping("/dologin3")public Map<String,Object> dologin3(@RequestBody Map<String,Object> reqMap) throws Exception {String username=reqMap.get("username").toString();System.out.println(username);Map<String,Object> map=new HashMap<>();map.put("aa", "1111");return map;}

适合 application/json 的情况:

  • RESTful API通信

  • 复杂数据结构

  • 需要明确数据类型

  • 前后端分离架构

  • 移动应用与服务器通信

两种情景是不一样的,如果你前端传入的是json格式,那么后端你用:

    String uu=request.getParameter("username");
    System.out.println(uu);

这样是无法接收到数据的,接收到的参数一直为null,因为json是整体作为一个流传入到后台的

希望对你有所帮助!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/79101.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

最新DeepSeek-Prover-V2-671B模型 简介、下载、体验、微调、数据集:专为数学定理自动证明设计的超大垂直领域语言模型(在线体验地址)

DeepSeek-Prover-V2-671B模型 简介、下载、体验、微调、数据集&#xff1a;专为数学定理自动证明设计的超大垂直领域语言模型&#xff08;在线体验地址&#xff09; 体验地址&#xff1a;[Hugging Face 在线体验]https://huggingface.co/playground?modelIddeepseek-ai/DeepS…

Kafka的Topic分区数如何合理设置?

一、分区数设置原则 1. 并发能力基准 分区数决定最大消费者并行度&#xff0c;建议设置为消费者组内消费者数量的整数倍 例如&#xff1a;消费者组有4个实例 → 分区数设为4/8/12等 这里定义的目的是为了让消费者能均匀的分配到分区&#xff0c;避免打破负载均衡&#xff0c;…

章越科技赋能消防训练体征监测与安全保障,从传统模式到智能跃迁的实践探索

引言&#xff1a;智能化转型浪潮下&#xff0c;消防训练的“破局”之需 2021年《“十四五”国家消防工作规划》的出台&#xff0c;标志着我国消防救援体系正式迈入“全灾种、大应急”的全新阶段。面对地震、洪涝、危化品泄漏等复杂救援场景&#xff0c;消防员不仅需要更强的体…

【数据库原理及安全实验】实验五 数据库备份与恢复

指导书原文 数据库的备份与恢复SSMS 【实验目的】 1) 熟悉并掌握利用界面操作进行数据库备份和恢复的原理和操作。 【实验原理】 1) 数据库的恢复包括大容量日志恢复模式和简单恢复模式。其中大容量日志恢复模式&#xff0c;简单地说就是要对大容量操作进行最小日志记录&a…

Linux 基础IO(上)--文件与文件描述符fd

前言&#xff1a; 在生活里&#xff0c;我们常和各种文件打交道&#xff0c;像用 Word 写文档、用播放器看视频&#xff0c;这些操作背后都离不开文件的输入输出&#xff08;I/O&#xff09;。在 Linux 系统中&#xff0c;文件 I/O 操作更是复杂且关键。 接下来我们将深入探讨…

快速了解Go+rpc

更多个人笔记&#xff1a;&#xff08;仅供参考&#xff0c;非盈利&#xff09; gitee&#xff1a; https://gitee.com/harryhack/it_note github&#xff1a; https://github.com/ZHLOVEYY/IT_note 文章目录 rpc基础概念GO的rpc应用简单编写json编写rpc rpc基础概念 电商系统…

基于大模型的膀胱肿瘤全周期诊疗方案研究报告

目录 一、引言 1.1 研究背景与意义 1.2 研究目的与方法 1.3 国内外研究现状 二、大模型预测膀胱肿瘤的原理与技术基础 2.1 大模型介绍 2.2 预测原理 2.3 技术支撑 三、术前风险预测与准备方案 3.1 肿瘤分期与恶性程度预测 3.2 患者身体状况评估 3.3 术前准备工作 …

2025年4月个人工作生活总结

本文为 2025年4月工作生活总结。 研发编码 一个项目的临时记录 自2月份领导让我牵头负责一个项目起&#xff0c;在本月算是有较多时间投入——但也是与之前的相比。 月初&#xff0c;清明节前一晚上&#xff0c;因某事务被叫上参加临时紧急远程会议&#xff0c;几方领导都在…

Python爬虫实战:获取软科网最新特定专业大学排名数据并做分析,为高考填报志愿做参考

一、引言 在高考升学的重要阶段,志愿填报成为考生和家长关注的核心问题。准确、全面且具有权威性的大学专业排名数据,是考生做出科学志愿决策的关键依据。软科网作为专业的大学排名信息发布平台,其发布的计算机科学与技术专业排名数据,因具有较高的公信力和参考价值,备受…

自学S32k144(18)————芯片锁死问题及成功解锁流程

1.锁死原因 温度过高flash异常操作静电等电压异常问题。。。。 本人出现情况&#xff1a;之前开发板不知什么原因&#xff0c;发生短路&#xff0c;重新置换芯片后&#xff0c;发现芯片在S32DS中无法正常烧录 判断可能是由于焊接时温度过高导致锁死。需解锁芯片。 2.解决方法…

ISIS的由于L1产生的一系列问题

如果有些名词不清晰可以查看之前文章 L1访问其他区域使用缺省路由会引发次优路径问题&#xff0c;但次优路径leak路由又会引发路由环路问题&#xff0c;下面将会从去缺省路由到路由环路一一解决 Level 1的缺省路由 L1访问其他区域使用缺省路由 --> 引发次优路径 --> 引…

C++继承(下)

目录 一、继承与友元 二、继承与静态成员 三、菱形继承及菱形虚拟继承 1. 继承的方式 2. 菱形继承的问题 3. 菱形虚拟继承 4. 虚拟继承解决数据冗余和二义性的原理 4.1 普通菱形继承的内存布局 4.2 虚拟继承的内存布局 四、继承的总结和反思 1. 多继承的复杂性 2.…

【漫话机器学习系列】233.激活阈(Threshold Activation)

深度学习入门&#xff1a;了解“阈值激活函数”&#xff08;Threshold Activation Function&#xff09; 激活函数是神经网络中至关重要的一环。今天&#xff0c;我们通过一幅简单直观的手绘图&#xff0c;一起理解最早期也最基础的激活函数之一 —— 阈值激活函数&#xff08;…

(4)python中jupyter lab使用python虚拟环境

1. 先了解IPython和IPyKernel简介 IPython 是一个功能强大的交互式 Python 解释器和开发环境。它提供了一种增强的 Python Shell,使得用户能够以交互的方式探索、分析和可视化数据。IPython 的名称来源于 "Interactive Python",体现了其交互式的特性。 IPyKernel 是…

nginx 配置要领

你提出的问题非常好&#xff01;确实在配置 WebSocket 代理时&#xff0c;proxy_pass 的 URL 处理需要特别注意。以下是关键解释和修正建议&#xff1a; 1. 原配置的问题分析 location /ws/ {proxy_pass http://fastapi-container:8000; # 会保留 /ws/ 前缀传递给后端 }这种配…

【AI】DeepSeek 流程图 / 时序图制作,Word 排版错乱问题,文字转直观图形

一&#xff1a;动态流程图 / 时序图制作&#xff08;DeepSeek Draw.IO&#xff09; 工具准备 DeepSeek&#xff08;AI 生成代码&#xff09;&#xff1a;官网&#xff08;免费&#xff09;Draw.IO&#xff08;可视化渲染&#xff09;&#xff1a;官网&#xff08;免费&#…

4. python3基本数据类型

Python3 中有六个标准的数据类型&#xff1a; Number&#xff08;数字&#xff09; String&#xff08;字符串&#xff09; List&#xff08;列表&#xff09; Tuple&#xff08;元组&#xff09; Set&#xff08;集合&#xff09; Dictionary&#xff08;字典&#xff09; Pyt…

WPF之TextBox控件详解

文章目录 1. TextBox概述2. 基本属性与功能3. 输入控制详解3.1 MaxLength3.2 AcceptsReturn3.3 AcceptsTab3.4 CharacterCasing3.5 IsUndoEnabled3.6 自定义输入限制 4. 文本选择与操作4.1 选择属性4.2 选择方法4.3 文本操作4.4 选择事件4.5 实现自定义文本处理功能 5. 滚动支持…

1.4 点云数据获取方式——结构光相机

图1-4-1结构光相机 结构光相机作为获取三维点云数据的关键设备,其工作原理基于主动式测量技术。通过投射已知图案,如条纹、点阵、格雷码等,至物体表面,这些图案会因物体表面的高度变化而发生变形。与此同时,利用相机从特定

【MATLAB第118期】基于MATLAB的双通道CNN多输入单输出分类预测方法

【MATLAB第118期】基于MATLAB的双通道CNN多输入单输出分类预测方法 一、双通道CNN简介 在深度学习领域&#xff0c;卷积神经网络&#xff08;CNN&#xff09;凭借其强大的特征提取能力&#xff0c;已成为图像识别、自然语言处理等任务的核心技术。传统单通道CNN在处理单一模态…