之前写了一篇 vue axios 前端数据传给后端一直 “参数不足”
中的解决方法中就使用了qs库
在这里插入图片描述
最近就又又又遇到了,然后一脸懵,找了好久才又想起使用这玩意。

*到底什么时候用qs库

1.axios官网中提到的qs库

2. content-type和 参数 的关系

  • content-type : application/json,要求的参数格式是JSON
{
	a:c,
	b:d
}
  • content-type :application / x-www-form-urlencoded 要求的参数格式是键值对拼接的方式(具体叫什么我也不清楚):key=value&key=value
	a=c&b=d

我一开始是设置了application / x-www-form-urlencoded,但是浏览器发送请求的时候,发现请求头是application/json,人傻了;
在这里插入图片描述
查到的解释:

  • 浏览器出于自我保护,根据参数的格式自动转化了content-type,
  • axios是根据参数的格式设置content-type的

就是需要我们这边把参数的格式给改成对应的数据格式

3. 什么是qs库?

  • 概述:将url中的参数转为对象;将对象转为url参数形式;
  • 基础用法:
	let obj1 = qs.parse('a=c'); // {a:'c'}
	let obj2 = qs.parse({a:c,b:d}); // a=c&b=d

4. 在axios中qs的使用

  1. 为post请求
  2. content-type为application / x-www-form-urlencoded 或者multipart/form-data

*为什么ajax的application/json也需要用?

找到了一个详细演示了,在ajax中, application/json需要用qs库进行转换
而application / x-www-form-urlencoded的参数形式是json,不需要用到qs库:
AXIOS使用APPLICATION/X-WWW-FORM-URLENCODED和APPLICATION/JSON传递参数的两种方式表现形式

*但是还有些不解

1.为什么vue-resource不需要这个东西?

*总结:

感觉写得不明不白的,我还是懂了又没懂,以后继续优化吧~

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐