项目场景:

post请求编码格式为content-type:application/x-www-form-urlencoded时,vue项目使用axios传参后端识别数据格式出错

问题描述:

这是错误代码:

在这里插入图片描述

报错:

在这里插入图片描述


原因分析:

这种格式的是form表单的格式,传统的$(“form”).serialize()就是将数据变成形如key&value的格式,然后传给后台解析,当然现如今serialize()在vue/angula/react等前端框架中都不怎么用了,如果要使用这种编码传输,可以使用npm的qs。qs就脱离form表单,直接将josn对象转换成形如key&value。所以使用这种编码的psot请求,如果是老项目可以直接只用serialize(),新的单页面应用的前端框架可以使用qs来达到同样的效果。


解决方案:

使用npm install qs安装,然后引入import qs from ‘qs’,使用qs.stringify()传参。

在这里插入图片描述

数据对比:

解析后:
在这里插入图片描述

解析前:在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐