Qs.stringify(data)和JSON.stringify(data)使用后关于get和post区别及问题

一、区别:
1、首先Qs.stringify(data)和JSON.stringify(data)打印出来的内容不同,JSON.stringify(data)转完过后还是一个json对象的形式,Qs.stringify(data)转完以后就变成一长串的字符串了。

在这里插入图片描述

2、请求头不一样,
Qs.stringify(data)的请求头类型正常情况是:Content-Type: application/x-www-form-urlencoded
JSON.stringify(data)的请求头类型正常情况是:Content-Type: application/json

二、问题:
1、这时候就会有一个很奇怪的问题,就是你前端发送get请求的时候,不管你的参数是用Qs.stringify(data)还是JSON.stringify(data)转完以后在发送的,后端通过@RequestParam String terminalInfoList或者request.getParameter(“employeeNo”)这2种方式都是可以获取到的,为什么了?
原因:因为get请求参数都是以url的形式传递给你的,上面2种方式都是专门针对get获取参数的,刚好就都可以拿到。
2、但是如果你是通过post请求,前端是Qs.stringify(data)转换过后的参数,那么后端就不可以通过@RequestBody Map/实体类这种方式获取前端传递的参数,因为@RequestBody针对的请求头类型是:Content-Type: application/json,数据格式必须是JSON.stringify(data)

三、注意事项:
1、如果你使用的是JSON.stringify(data),就不需要操太多的心,后端不管是get还是post请求都能拿到参数。
2、如果你使用的是Qs.stringify(data),那么这个data中是多层的,既有单个的字符又有对象又有集合,那么对象和集合就得先用JSON.stringify(data)转换一下,要不然后端还是接受不到。

四、正确案列如下:
Qs.stringify(data)----Content-Type: application/x-www-form-urlencoded这种格式的:

前端:

	  saveTerminalInfo (data) {
	     service.hospitalGroupTargetManagement.saveTerminalInfo({
	         terminalInfoList: JSON.stringify(this.terminalInfo),
	         terminalBusinessList: JSON.stringify(this.businessList),
	         terminaBrandlList: JSON.stringify(this.productList),
	         searchInstitutionno: this.terminalInfo.institutionno,
	         no: this.terminalInfo.no.toString(),
	         employee: getFromCookie('employeeno')
	       }).then(res => {
	     })
	   },

        return new Promise((resolve, reject) => {
            axios.post(url, Qs.stringify(data)).then(response => {
                if(response.status == 200){
                    resolve (response.data);
                } else {
                    Notice.error({
                        title : '请求失败',
                        desc : '服务器异常信息:' + response.status
                    })
                    resolve('HTTP ERROR')
                }
            }).catch(error => {
                Notice.error({
                    title : '请求失败',
                    desc : '服务器返回异常'
                })
                resolve('HTTP ERROR')
            })
        })
后端
import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;

    @RequestMapping(value = "/apis/informationMaintenance/updateTerminal", method = RequestMethod.POST)
    @ResponseBody
    public ResultEntity updateTerminal(@RequestParam String terminalInfoList,@RequestParam String terminalBusinessList,@RequestParam String terminaBrandlList,@RequestParam String searchInstitutionno,
                                       @RequestParam String no,@RequestParam String employee) {
        ResultEntity<Integer> entity = new ResultEntity<>();
        try {
        //对象通过JSON.parse转换
            Map<String,Object>  terminalInfoListData =(Map<String,Object>) JSON.parse(terminalInfoList);
             //集合通过JSONArray.parseArray转换
            List terminalBusinessListData = JSONArray.parseArray(terminalBusinessList);
            List terminaBrandlListData = JSONArray.parseArray(terminaBrandlList);
            if (StringUtils.isBlank(searchInstitutionno) || StringUtils.isBlank(no) || StringUtils.isBlank(employee)) {
                throw new Exception("必传参数不能为空");
            }
            entity.setData(distributionInfoMationService.updateTerminal(terminalInfoListData,terminalBusinessListData,terminaBrandlListData,searchInstitutionno,no,employee));

JSON.stringify(data):Content-Type: application/json这种格式的:

前端:
无需其他操作,发请求的时候直接转,axios的时候get请求用params,post用data。
        return new Promise((resolve, reject) => {
            axios.post(url, JSON.stringify(data)).then(response => {
                if(response.status == 200){
                    resolve (response.data);
                } else {
                    Notice.error({
                        title : '请求失败',
                        desc : '服务器异常信息:' + response.status
                    })
                    resolve('HTTP ERROR')
                }
            }).catch(error => {
                Notice.error({
                    title : '请求失败',
                    desc : '服务器返回异常'
                })
                resolve('HTTP ERROR')
            })
        })

后端:

    @RequestMapping(value = "/apis/informationMaintenance/updateTerminal", method = RequestMethod.POST)
    @ResponseBody
    public ResultEntity updateTerminal(@RequestBody Map<String,Object>  allterminalInfoList) {
        ResultEntity<Integer> entity = new ResultEntity<>();
        try {
            Map<String,Object> terminalInfoList =(Map<String,Object>) allterminalInfoList.get("terminalInfoList");
            List<Map<String,Object>> terminalBusinessList =(List<Map<String,Object>>) allterminalInfoList.get("terminalBusinessList");
            List<Map<String,Object>> terminaBrandlList =(List<Map<String,Object>>) allterminalInfoList.get("terminaBrandlList");
            String searchInstitutionno =(String) allterminalInfoList.get("searchInstitutionno");
            String no =(String) allterminalInfoList.get("no");
            String employee =(String) allterminalInfoList.get("employee");
### 回答1: qs.stringify是一个将对象转换为查询字符串的工具,它可以将对象中的属性和值转换为URL中的查询参数,例如:将{a:1, b:2}转换为?a=1&b=2。 json.stringify是一个将JavaScript对象转换为JSON字符串的工具,它可以将JavaScript对象中的属性和值转换为JSON格式的字符串,例如:将{a:1, b:2}转换为{"a":1,"b":2}。 ### 回答2: qs.stringifyjson.stringify都是将JavaScript对象转化为字符串的方法,在使用中有一些不同的应用场景和方式。 qs.stringify是一个非常常用的方法,它的作用是将对象序列化为URL查询字符串。当我们需要将对象的值作为查询字符串的参数传递给服务器端时,通常使用这个方法。例如: ```javascript const obj = {foo: 'bar', baz: ['qux', 'quux'], corge: ''}; console.log(qs.stringify(obj)); // 'foo=bar&baz%5B0%5D=qux&baz%5B1%5D=quux&corge=' ``` qs.stringify会对对象进行递归序列化,将对象的属性和值都转化为字符串。在上面的例子中,baz属性是一个数组,qs.stringify会将它序列化为'baz%5B0%5D=qux&baz%5B1%5D=quux',对应于URL查询字符串中的'baz[0]=qux&baz[1]=quux'。corge属性是一个空字符串,因此序列化后会转化为空字符串。 另一方面,json.stringify的作用是将对象序列化为JSON字符串。当我们需要将对象的值作为JSON格式的数据传递给服务器端时,通常使用这个方法。例如: ```javascript const obj = {foo: 'bar', baz: ['qux', 'quux'], corge: ''}; console.log(JSON.stringify(obj)); // '{"foo":"bar","baz":["qux","quux"],"corge":""}' ``` json.stringify同样会对对象进行递归序列化,将对象的属性和值都转化为JSON格式的字符串。在上面的例子中,baz属性是一个数组,json.stringify会将它序列化为'["qux","quux"]',对应于JSON格式中的'["qux", "quux"]'。corge属性是一个空字符串,因此序列化后会转化为空字符串。 总的来说,qs.stringifyjson.stringify都是非常有用的辅助方法,它们能够帮助我们将对象序列化为字符串进行传递,不同的是qs.stringify序列化为查询字符串,而json.stringify序列化为JSON格式字符串。在具体应用中,我们需要根据情况选择不同的方法来进行序列化。 ### 回答3: qs.stringify是Node.js中一个简单的将对象序列化成URL查询字符串的库。该库支持嵌套对象,并且可以通过设置参数选项来控制如何序列化。qs.stringify序列化对象时,会将对象中的属性名按照字母顺序排序,然后根据key=value的形式生成查询字符串。该库的主要使用场景是发送POST请求或GET请求时,可以方便地将对象作为请求体或查询参数发送到服务器端。 而JSON.stringify是将一个JavaScript对象转换为一个JSON字符串的方法。该方法会忽略对象中的函数和undefined属性,并能处理Number和String的非基本数据类型,例如Infinity、NaN、正则表达式等。JSON.stringify用于在客户端与服务端之间传递数据。在前端开发中,我们通常会用JSON.stringify将JS对象序列化成字符串,然后将其发送到后端API接口。相反地,后端API接口处理数据后,也可以通过JSON.stringify将数据序列化为JSON字符串,然后返回给前端。此外,JSON.stringify还有一个很实用的功能,可以接受第二个参数,用于指定哪些属性应该被序列化或者转换输出的格式等。 总的来说,qs.stringify主要用于序列化URL查询字符串,用于发送GET或POST请求时,而JSON.stringify主要用于在前端与后端传递JSON数据,进行数据交互时使用。两者在使用场景及功能上有所区别,但都是JS中常用的序列化操作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值