前端与spring交互数据的处理和接收基础方式

1.Query Params传参方式

query params就是最简单的问号传参方式，而spring接受参数方式有以下几种不需要额外第三方包。

• 支持类型: url
• 支持请求类型: get
• 支持的Content-Type: all
• 请求示例:/test/get?id=12345

@RestController
@RequestMapping("/test")
public class TestController {
    private static Logger log = LogManager.getLogger(TestController.class);

    @RequestMapping(value = "/get", produces = MediaType.APPLICATION_JSON_UTF8_VALUE)
    public ResultVO getInfo(String id, @RequestParam("id") String tid, HttpServletRequest request) {


        String rid = request.getParameter("id");

        log.info("String id:"+id+";@RequestParam(\"id\"):"+tid+";request.getParameter:"+rid);

        return new ResultVO(ResultStatusCode.SUCCESS);
    }
}
/* PS:
new ResultVO(ResultStatusCode.SUCCESS)是自己封装的JSON对象和枚举，就不展示了。
Controller使用了@RestController这个是只返回json数据不能跳转页面，
@Controller是能跳转页面默认不返回json，需要在对应的方法加上@ResponseBody注解。
@RequestMapping 同时支持get和post，没做区分。
区分的话自主控制@RequestMapping (value =  "/get" , method = {RequestMethod. POST ,RequestMethod. GET })
*/

前端传参：

image.png

后台接收：

image.png

2.占位符传参方式

统一资源定位符(又称URL)是一种资源命名或定位格式，用于指定或寻址资源。 URL在Web上非常流行，在Web上使用URL格式寻址或标识网站和Web资源。
2000年Roy Fielding博士在其博士论文中提出REST(Representational State Transfer)风格的软件架构模式后，REST就基本上迅速取代了复杂而笨重的SOAP，成为Web API的标准了。
RESTful作为目前最流行的 API 设计规范，一定有着它独有的魅力：强大、简介、易上手。

• 支持类型: url
• 支持请求类型: get
• 支持的Content-Type: all
• 请求示例:/test/get/{id}

    @RequestMapping(value = "/get/{id}", produces = MediaType.APPLICATION_JSON_UTF8_VALUE)
    public ResultVO getInfoPath(@PathVariable("id") String id) {

        log.info("String id:"+id);

        return new ResultVO(ResultStatusCode.SUCCESS);
    }

/*
PS:这种RESful的API设计规范确实有它的独到之处，作为互联网展示信息来说它是非常简介好用的。
但是如果对企业应用的增删改来说，它的安全性不友好了。
如：post提交修改信息时修改地址栏占位符修改了其他数据的信息，/update/user/0001，body中包含要修改的用户数据，地址栏直接改为/update/user/0002是不是也把0002用户的信息也修改了呢？
如果修改密码重置密码也使用RESful占位符的设计，那只要登录的用户就可以把其他用户密码给修改或重置了。这里假设的是稍微有点网络知识的人，要说懂开发会debug的，抓包的，还会http测试软件和发包的人
让他来搞破坏找漏洞还是很容易的。
*/

前端传参：

image.png

后台接收：

image.png

3.表单提交

以前的form表单和formData是ajax2.0(XMLHttpRequest Level2)新提出的接口,利用FormData对象可以将form表单元素的name与value进行组合,实现表单数据的序列化。
而x-www.form-urlencoded是post默认数据传输格式，跟Query Params传参方式一样。

• 支持类型: Body
• 支持请求类型: Post/Put/Delete/Patch
• 支持的Content-Type: form-data,x-www.form-urlencoded
• 请求示例: 好几种

    @RequestMapping(value = "/add", produces = MediaType.APPLICATION_JSON_UTF8_VALUE, method = RequestMethod.POST)
    public ResultVO add(String name, @RequestParam("name") String rpname,String age, @RequestParam("age") String rpage, HttpServletRequest request) {

        String rname = request.getParameter("name");
        String rage = request.getParameter("age");

        log.info("String name:" + name + ";@RequestParam(\"name\"):" + rpname + ";request.getParameter:" + rname);
        log.info("String age:" + age + ";@RequestParam(\"age\"):" + rpage + ";request.getParameter:" + rage);

        return new ResultVO(ResultStatusCode.SUCCESS);
    }
//文件流和字段
    @RequestMapping(value = "/addFile", produces = MediaType.APPLICATION_JSON_UTF8_VALUE, method = RequestMethod.POST)
    public ResultVO addUserFile(String name, @RequestParam("name") String rpname, String age, MultipartFile pic, @RequestParam("age") String rpage, HttpServletRequest request) {

        String rname = request.getParameter("name");
        String rage = request.getParameter("age");
        log.info("pic:"+pic.getSize());
        log.info("String name:" + name + ";@RequestParam(\"name\"):" + rpname + ";request.getParameter:" + rname);
        log.info("String age:" + age + ";@RequestParam(\"age\"):" + rpage + ";request.getParameter:" + rage);

        return new ResultVO(ResultStatusCode.SUCCESS);
    }

    @RequestMapping(value = "/addUser", produces = MediaType.APPLICATION_JSON_UTF8_VALUE, method = RequestMethod.POST)
    public ResultVO addUser(User user,HttpServletRequest request) {
        log.info("String user:" + user.toString());

        return new ResultVO(ResultStatusCode.SUCCESS);
    }
//PS:对象接收时，变量名不影响接收，不需要user.name，不要加@RequestBody，form表单不是json对象。

1.参数值接收：

前端传参：

image.png

后端接收：

image.png

2.对象接收：

前端传参：

image.png

后端接收：

image.png

image.png

3.文件流和参数对象接收:

前端传参：

image.png

后端接收：

image.png

前端传参：

image.png

后端接收：

image.png

image.png

4.json对象接收！！！！注意这个是json对象，不是json字符串

ajax/axios传输json对象,适用于GET和POST请求，且此时contentType必须为application/x-www-form-urlencoded; charset=UTF-8，ajax会自动将json对象转化为&连接的key=value格式的数据。axios需要指定传参params，而GET请求就跟Query Params传参方式一样的，POST请求就放入post请求体中。

• 支持类型: Body
• 支持请求类型: Get/Post/Put/Delete/Patch
• 支持的Content-Type: application/x-www-form-urlencoded; charset=UTF-8
• 请求示例: 好几种

    @RequestMapping(value = "/addUser", produces = MediaType.APPLICATION_JSON_UTF8_VALUE, method = RequestMethod.POST)
    public ResultVO addUser(User user, HttpServletRequest request) {
        log.info("String user:" + user.toString());

        return new ResultVO(ResultStatusCode.SUCCESS);
    }


    @RequestMapping(value = "/addJSONObj", produces = MediaType.APPLICATION_JSON_UTF8_VALUE, method = RequestMethod.POST)
    @ResponseBody
    public ResultVO addJSON(String name, @RequestParam("name") String rpname, String age, @RequestParam("age") String rpage, HttpServletRequest request) {

        String rname = request.getParameter("name");
        String rage = request.getParameter("age");
        log.info("String name:" + name + ";@RequestParam(\"name\"):" + rpname + ";request.getParameter:" + rname);
        log.info("String age:" + age + ";@RequestParam(\"age\"):" + rpage + ";request.getParameter:" + rage);

        return new ResultVO(ResultStatusCode.SUCCESS);
    }

前端传参：

image.png

image.png

image.png

后台接收：这里要注意了，传json对象后台是对嵌套json对象不友好，要是有嵌套得自己处理很麻烦，所以传输json对象一般是简单json对象

image.png

5.json字符串接收！！！！注意这个是json字符串，不是json对象别弄混了，前端要把对象转字符串的。

      ajax/axios传输json字符串,是前端js把json对象字符串序列化到内存然后以http协议通过网络传输到后台，而spring使用网络套接字把传过来的序列化的json对象进行反序列化转换为java对象使用注解@RequestBoydy。而以前使用java原生HttpServlet 需要通过request.getInputStream()获取数据然后使用JSONObject来反序列化。

ajax需要自己转字符串，asios使用data传参会默认给转成json字符串

Servlet的框架是由两个Java包组成:javax.servlet和javax.servlet.http。 在javax.servlet包中定义了所有的Servlet类都必须实现或扩展的的通用接口和类，在javax.servlet.http包中定义了采用HTTP[通信协议]的HttpServlet类。spring也是基于Servlet的框架的

什么是序列化和反序列化
对象的序列化就是把对象转化成字节序列进行发送、存储，反序列化在接收和读取的时候把字节序列转化成对象。

• 支持类型: Body
• 支持请求类型: Post/Put/Delete/Patch
• 支持的Content-Type: application/json; charset=UTF-8
• 请求示例: 好几种

    @RequestMapping(value = "/addJSONStr", produces = MediaType.APPLICATION_JSON_UTF8_VALUE, method = RequestMethod.POST)
    @ResponseBody
    public ResultVO addJSONStr(@RequestBody User user, HttpServletRequest request) {

        log.info("String user:" + user.toString());

        return new ResultVO(ResultStatusCode.SUCCESS);
    }

前端传参：

image.png

image.png

后台接收：这是json字符串用对象接收，也可以使用Map等。springboot项目添加spring-boot-starter-web依赖，默认提供了Jackson用于解析json，da大部分人使用om.alibaba.fastjson

通过关键字段@RequestBody，标明这个对象接收json字符串，然后自己使用Gson、fastjson等自己解析转对象

image.png

通过@RequestBody注解对象接收，则需要添加一些json解析器，Spring Boot做了自动化配置，只需要添加jackson、gson、fastjson依赖就起作用，但是如果对时间转换则需要自己写个Bean。转载至：springboot中的json、gson、fastjson如何使用与日期格式转换

image.png

image.png