http请求头:content-type参数application/x-www-form-urlencoded

在HTTP协议消息头中,使用Content-Type来表示请求和响应中的媒体类型信息。它用来告诉服务端如何处理请求的数据,以及告诉客户端(一般是浏览器)如何解析响应的数据,比如显示图片,解析并展示html等等

application/x-www-form-urlencoded                                                                                  

       定义这种格式之后,如果前端的参数直接传给后台接口,后台接口会报错,拿不到参数。这种格式是需要对入参进行一个序列化的操作方法,在以前的框架中,可以使用$(“form”).serialize()进行序列化参数转换,在vue/angula/react等前端框架中都不怎么用了,如果要使用这种编码传输,可以使用npm的qs。qs就脱离form表单,直接将josn对象转换成形如key&value。所以使用这种编码的post请求,如果是老项目可以直接只用serialize(),新的单页面应用的前端框架可以使用qs来达到同样的效果。

处理之前传入的参数如下图

http请求头:content-type参数application/x-www-form-urlencoded_第1张图片

 处理之后传入的参数

 在vue项目中,先安装qs,然后引用

npm install qs --save
// 放在main.js全局引用
import qs from "qs"
Vue.prototype.$qs = qs

//也可以直接在调用的组件单独引用
import qs from "qs"

在vue项目中如果是用axios调用接口的,可以在请求拦截器里统一处理http请求头:content-type参数application/x-www-form-urlencoded_第2张图片

 这样就搞定了,OK

你可能感兴趣的:(http,服务器,网络协议)