post提交方式为什么要序列化,而get提交方式就不用?序列化做了什么?

一、get请求方式为何不需要序列化?

qs.stringify()是将对象 序列化成URL的形式,以&进行拼接。

get请求方式提交数据时,参数之间附加到url后边,即http://xxxx.xxx?a=1&b=2&c=3

?后边正式服务端可以直接处理的数据格式,所以get方式直接提交数据的话就不需要再对参数进行序列化处理,直接提交即可。

二、post提交方式为什么要序列化?

后台能够直接处理的数据格式,是一种经过序列化的键值对数据。

如:前端向服务端传递三个参数a=1,b=2,c=3,那么服务端接受到数据应该是a=1&b=2&c=3,每个键值对之间用&链接。

post方式提交时,提交的数据本身就是一个json对象,如:
var data = {a:1,b:2,c:3}

提交时候是直接以原始数据格式存储在body中的,而不是以键值对的形式附加到url中,所以服务端是无法直接识别的。我们需要在提交之前将data转换成a=1,b=2,c=3的格式再提交,这就是序列化。

deleteOne(data){
    return request({
        url:this.url_key + '/delete',
        method: 'post',
        data: qs.stringify(data)
    })
}

当然,如果数据是通过表单提交,不管是get还是post,浏览器都会自动进行序列化,无需前端再做处理。

三、qs.stringify()和JSON.stringify()的区别?

JSON.stringify()

//JSON.stringify({uid:"cs11",pwd:"000000als",username:"cs11",password:"000000als"} )
{"uid":"cs11","pwd":"000000als","username":"cs11","password":"000000als"}

QS.stringify()

//QS.stringify({uid:"cs11",pwd:"000000als",username:"cs11",password:"000000als"} )
uid=cs11&pwd=000000als&username=cs11&password=000000als

四、Vue使用qs插件

1、安装qs
npm install qs

2、引入qs(在需要的组件中引入)
import qs from 'qs'

3、qs序列化方法:qs.parse()和qs.stringify()

qs.parse()是将URL解析成对象形式;

即:uid=cs11&pwd=000000als&username=cs11&password=000000als
解析成{uid:"cs11",pwd:"000000als",username:"cs11",password:"000000als"}

qs.atringify()是将对象序列化成URL的形式,以&进行拼接;

即:
{uid:"cs11",pwd:"000000als",username:"cs11",password:"000000als"} 序列化成
uid=cs11&pwd=000000als&username=cs11&password=000000als


资料参考:
http://www.mamicode.com/info-detail-2877097.html

https://www.cnblogs.com/andyZhang0511/p/11671713.html

推荐阅读更多精彩内容