前后端交互常见的几种数据传输格式 form表单+get请求 form表单+post请求 json键值对格式

目录

1. get请求 query string

2.form表单+get请求

3..form表单+post请求

4..json格式

5.总结

1. get请求 query string

前端通过get请求携带 query string（键值对） ,后端通过req.getParameter(key)方法获取数据。如果key不存在，获取到的就是null。querystring 会被 Tomcat 处理成形如Map这样的结构，就可以通过key获取value了。这种是直接在地址栏里输入querystring: ?username=lisi&password=123。

protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = req.getParameter("username");String password = req.getParameter("password");resp.setContentType("text/html;charset=utf8");resp.getWriter().write("username="+username+" password="+password);}

2.form表单+get请求

和上面差不多，一个是以get方式在地址栏手写querystring，这个是通过form表单构造get请求，同样也是在传querystring。可以看到get请求会将数据显示在地址栏上。

后端

@WebServlet("/test")
public class test extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = req.getParameter("username");String password = req.getParameter("password");resp.setContentType("text/html;charset=utf8");resp.getWriter().write("我是响应数据");}
}

前端

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><form action="test" method="get"><input type="text" name="username"><input type="text" name="password"><input type="submit"></form>
</body>
</html>

后端通过前端name属性所对应的字符串获取到输入的数据。

通过fiddler抓包可以看到get请求请求的数据被拼接到了URL后面，后端我通过resp.getWriter().writer()进行响应，响应数据是在body中被传回来的。

3..form表单+post请求

请求在body中被传过去，不会显示在地址栏上。同样使用getParameter方法可以获取到value。通过前端name属性所对应的字符串获取到输入的数据。

后端

@WebServlet("/test")
public class test extends HttpServlet {@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = req.getParameter("username");String password = req.getParameter("password");resp.setContentType("text/html;charset=utf8");resp.getWriter().write("我是响应数据");}
}

前端

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><form action="test" method="post"><input type="text" name="username"><input type="text" name="password"><input type="submit"></form>
</body>
</html>

通过抓包可以看到，post请求的数据不会被拼接到URL后面，而是通过存在在body中传过去的。 

响应数据还是在body中传回来的。这就是人们所说的post请求安全，get请求不安全。

4..json格式

json是一种键值对结构的数据格式。通过请求或响应的body中传递。

格式:

{

        username: lisi,

        password: 123

} 

或嵌套:

{

          {

                username: zhangsan,

                password: 666

          }      

          {

                username: lihiai,

                password: 456

          }

}

其实在数据传输前，我们程序员自己手动写代码也能构造这种json格式的字符串，但这样效率不高。我们可以使用jackson这样的第三方库，这样只需要要往它的方法中传一个对象，它就能返回一个构造好的json格式的字符串，往它的方法中传一个json格式的字符串，他也能返回一个对象。在maven中央仓库中搜索jackson。

  • 首先创建jackson的实例对象

ObjectMapper mapper = new ObjectMapper();   ObjectMapper 对象映射器

  • Servlet中将一个对象转成json格式的字符串

String respJson = mapper.writeValueAsString(users);

  • Servlet中将多个对象转成json格式的字符串 前提是多个对象在LIst集合中

String respJson = mapper.writeValueAsString(list);

  • servlet中将json格式的字符串转成一个对象

User user = mapper.readValue(req.getInputStream(), User.class);

  1. 通过第一个参数先从body中以字节为单位读取出json格式的字符串；
  2. 通过第二个参数 创建User实例；
  3. 解析json格式的字符串 并转换成map键值对结构；
  4. 对map的key进行遍历与实例的属性名进行匹配 匹配成功后就会把map的value赋值给该实例的属性；
  5. 返回该实例。

  • Ajax构造请求数据时将一个JS对象转成json格式的字符串

let jsonReq = JSON.stringify(body);

举个例子： 

    <script>/*获取数据*/let inputs = document.querySelectorAll('input');/*获取按钮元素*/let button = document.querySelector('#submit');button.onclick = function () {/*判断数据*/let fromUser = inputs[0].value;let toUser = inputs[1].value;let message = inputs[2].value;if(fromUser=="" || toUser=="" || message=="") {alert("内容不能为空!");return;}/*构造JS对象*/let body = {"fromUser": fromUser,"toUser": toUser,"message": message};//通过stringify方法将JS对象转成json字符串let jsonStr = JSON.stringify(body);$.ajax({type: 'post',url: 'message',contentType: 'application/json;charset=utf8',data:jsonStr,success: function (body) {alert("发送成功!");}});/*发送成功后输入框清空*/for (let input of inputs) {input.value = "";}   }</script>

或直接在你的项目的pom.xml中加入下面这段代码，再刷新即可：

<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind --><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.14.2</version></dependency>
public class test extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {ObjectMapper mapper = new ObjectMapper();/*第一种处理方式*/// 是把请求中的json格式的数据转成一个对象Users users1 = mapper.readValue(req.getInputStream(), Users.class);// 1.通过第一个参数先从body中以字节为单位读取出json格式的字符串// 2.通过第二个参数 创建Users实例// 3.解析json格式的字符串 并转换成map键值对结构// 4.对map的key进行遍历与实例的属性名进行匹配 匹配成功后就会把map的value赋值给该实例的属性。// 5.返回该实例/*第二种处理方式*/// 这里的user是一个实例对象// 将该对象转成json格式的字符串String respJson = mapper.writeValueAsString(users);resp.setContentType("application/json;charset=utf8");resp.getWriter().write(respJson);}
}

5.总结

前端通过form表单将请求提交到tomcat服务器，Tomcat接收到请求之后，解析该请求，会把这个请求的方法，URL，版本号，各种header，body啥的都解析出来，构造成req对象(这里面就存着该请求的相关数据，通过它里面的已有的各种方法可以获取到)和resp象。 Tomcat通过请求中的url和请求方法选择并调用我们自己写的继承自HttpServlet的类的doPost方法或doGet方法等等，我们需要重写方法。最后通过resp对象包装响应数据数据返回给Tomcat，tomcat发送给浏览器。

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

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

相关文章

3D模型人物换装系统

3D模型人物换装系统

3D模型人物换装系统 介绍遇到的问题问题修复具体实现换装1.准备所有模型部位和模型骨骼部位准备材质准备模型根骨骼准备创建文件夹将上述模型拖成预制体创建一个动画状态机给他们附上待机动画 2.脚本驱动Mesh合并代码 UCombineSkinnedMgr.cs创建Mesh以及实例化对象的代码 UChar…
阅读更多...
Kotlin文件和类为什么不是一对一关系

Kotlin文件和类为什么不是一对一关系

在Java中&#xff0c;一个类文件的public类名必须和文件名一致&#xff0c;如何不一致就会报异常&#xff0c;但是在kotlin的文件可以和类名一致&#xff0c;也可以不一致。这种特性&#xff0c;就跟c有点像&#xff0c;毕竟c的.h 和 .cpp文件是分开的。只要最终编译的时候对的…
阅读更多...
threejs(11)-shader着色器打造漫天飞舞孔明灯

threejs(11)-shader着色器打造漫天飞舞孔明灯

src/main/main.js import * as THREE from "three";import { OrbitControls } from "three/examples/jsm/controls/OrbitControls"; import gsap from "gsap"; // 动画库 import vertexShader from "../shaders/flylight/vertex.glsl"…
阅读更多...
不可否认程序员的护城河已经越来越浅了

不可否认程序员的护城河已经越来越浅了

文章目录 那些在冲击程序员护城河低代码/无代码开发平台自动化测试和部署工具AI辅助开发工具在线学习和教育平台 面临冲击&#xff0c;程序员应该怎么做深入专业知识&#xff1a;不断学习全栈技能开发解决问题的能力建立人际网络管理和领导技能 推荐阅读 技术和应用的不断发展对…
阅读更多...
用于图像处理的高斯滤波器 （LoG） 拉普拉斯

用于图像处理的高斯滤波器 （LoG） 拉普拉斯

一、说明 欢迎来到拉普拉斯和高斯滤波器的拉普拉斯的故事。LoG是先进行高斯处理&#xff0c;继而进行拉普拉斯算子的图像处理算法。用拉普拉斯具有过零功能&#xff0c;实现边缘岭脊提取。 二、LoG算法简述 在这篇博客中&#xff0c;让我们看看拉普拉斯滤波器和高斯滤波器的拉普…
阅读更多...
Docker快速入门

Docker快速入门

Docker是一个用来快速构建、运行和管理应用的工具。 Docker技术能够避免对服务器环境的依赖&#xff0c;减少复杂的部署流程&#xff0c;有了Docker以后&#xff0c;可以实现一键部署&#xff0c;项目的部署如丝般顺滑&#xff0c;大大减少了运维工作量。 即使你对Linux不熟…
阅读更多...
Learn runqlat in 5 minutes

Learn runqlat in 5 minutes

内容预告 learn X in 5 系列第一篇. 本篇主要介绍进程时延统计方式和 rawtracepoint. runqlat "高负载场景下应用为何卡顿", "进程 A 为什么得不到调度". 当我们在工作生活中产生这样的疑问, 目标进程的调度时延是一个不错的观测切入点. runqlat 可以帮…
阅读更多...
【网络编程】网络层——IP协议

【网络编程】网络层——IP协议

文章目录 基本概念路径选择主机和路由器 IP协议格式分片与组装网段划分IP地址的数量限制私网IP地址和公网IP地址深入认识局域网路由 基本概念 TCP作为传输层控制协议&#xff0c;其保证的是数据传输的可靠性和传输效率&#xff0c;但TCP提供的仅仅是数据传输的策略&#xff0c…
阅读更多...
C语言 每日一题 PTA 11.7 day13

C语言 每日一题 PTA 11.7 day13

1.求e的近似值 自然常数 e 可以用级数 1 1 / 1! 1 / 2! ⋯ 1 / n! ⋯ 来近似计算。 本题要求对给定的非负整数 n&#xff0c;求该级数的前 n 1 项和。 代码实现 #include<stdio.h> void main() {int a, i, j; double b 1; double c 1;printf("请输入一个数\n…
阅读更多...
考研数据结构单链表的增删改查看这一篇就够了

考研数据结构单链表的增删改查看这一篇就够了

目录 一. 单链表的特点 1.1 解引用拓展 &#x1f916; 二. 单链表的操作 2.1不带头节点的操作 2.1.1 打印 2.1.1.1 创建结点 2.1.2 尾插&#xff08;需要二级指针&#xff09; 注意形参的值不改变实参&#xff1a;&#xff08;精髓部分&#xff09; 2.1.3 头插 2.1.4…
阅读更多...
苹果手机安装未上架APP应用测试教程

苹果手机安装未上架APP应用测试教程

STEP 2&#xff1a;找到下载的描述文件&#xff08;如果没有找到&#xff0c;请到 设置 - 通用 - 描述文件 中查看&#xff09; STEP 3&#xff1a;安装描述文件 STEP 4&#xff1a;输入解锁密码安装描述文件 STEP 5&#xff1a;同意免责声明&#xff0c;安装描述文件 STEP 6…
阅读更多...
单词规律问题

单词规律问题

给定一种规律 pattern 和一个字符串 s &#xff0c;判断 s 是否遵循相同的规律。 这里的 遵循 指完全匹配&#xff0c;例如&#xff0c; pattern 里的每个字母和字符串 s 中的每个非空单词之间存在着双向连接的对应规律。 示例1: 输入: pattern “abba”, s “dog cat cat d…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023