使用axios发送post请求,将JSON数据改为form类型的示例


Posted in Javascript onOctober 31, 2019

通常前端通过POST请求向服务器端提交数据格式有4中,分别是"application/x-www-form-urlencoded"格式、" multipart/form-data"格式、"application/json"格式和"text/xml"格式。通常最常见的是"application/json"格式,也就是通过JSON字符串形式。

使用axios发送post请求,将JSON数据改为form类型的示例

在控制台看到的数据就是这样:

使用axios发送post请求,将JSON数据改为form类型的示例

有的时候后台需要Form形式的数据才能正常解析,所以前端需要在传过去时修改一下格式。开始我以为是修改Content-Tyoe属性,于是就

axios.defaults.headers = {
 'Content-type': 'application/x-www-form-urlencoded'
}

设置之后看到请求时的Content-type变成了application/x-www-form格式,但是数据没变。之后找了很久终于找到真正的方法。

第一步:引入axios ps

使用axios发送post请求,将JSON数据改为form类型的示例

第二步:使用qs 转换

使用axios发送post请求,将JSON数据改为form类型的示例

之后看一下请求数据格式就变成了这样:

使用axios发送post请求,将JSON数据改为form类型的示例

以上这篇使用axios发送post请求,将JSON数据改为form类型的示例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
TFDN图片播放器 不错自动播放
Oct 03 Javascript
jquery ajax方式直接提交整个表单核心代码
Aug 15 Javascript
解析jQuery的三种bind/One/Live事件绑定使用方法
Dec 30 Javascript
IE的事件传递-event.cancelBubble示例介绍
Jan 12 Javascript
JS中实现简单Formatter函数示例代码
Aug 19 Javascript
用JavaScript实现PHP的urlencode与urldecode函数
Aug 13 Javascript
jquery实现平滑的二级下拉菜单效果
Aug 26 Javascript
jQuery动态生成不规则表格(前后端)
Feb 21 Javascript
Vue的轮播图组件实现方法
Mar 03 Javascript
js实现二级菜单点击显示当前内容效果
Apr 28 Javascript
深入Node TCP模块的理解
Mar 13 Javascript
layui的数据表格+springmvc实现搜索功能的例子
Sep 28 Javascript
vue封装可复用组件confirm,并绑定在vue原型上的示例
Oct 31 #Javascript
关于vue表单提交防双/多击的例子
Oct 31 #Javascript
Vuex的实战使用详解
Oct 31 #Javascript
如何在Vue中抽离接口配置文件
Oct 31 #Javascript
vue自定义指令实现仅支持输入数字和浮点型的示例
Oct 30 #Javascript
基于Vue中使用节流Lodash throttle详解
Oct 30 #Javascript
Vue最新防抖方案(必看篇)
Oct 30 #Javascript
You might like
那些年一起学习的PHP(一)
2012/03/21 PHP
如何把php5.3版本升级到php5.4或者php5.5
2015/07/31 PHP
一段实用的php验证码函数
2016/05/19 PHP
PHP实现数组array转换成xml的方法
2016/07/19 PHP
PHP关于foreach复制知识点总结
2019/01/28 PHP
JQuery AJAX提交中文乱码的解决方案
2010/07/02 Javascript
有关DOM元素与事件的3个谜题
2010/11/11 Javascript
JQuery 应用 JQuery.groupTable.js
2010/12/15 Javascript
基于JQuery的多标签实现代码
2012/09/19 Javascript
js中关于一个分号的崩溃示例
2013/11/11 Javascript
JQuery中使用Ajax赋值给全局变量失败异常的解决方法
2014/08/18 Javascript
jQuery中;function($,undefined) 前面的分号的用处
2014/12/17 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
2015/05/14 Javascript
javascript实现base64 md5 sha1 密码加密
2015/09/09 Javascript
js计算系统当前日期是星期几的方法
2016/07/14 Javascript
angularjs2中父子组件的数据传递的实例代码
2017/07/05 Javascript
JS 60秒后重新发送验证码的实例讲解
2017/07/26 Javascript
详解vue渲染函数render的使用
2017/12/12 Javascript
React-native桥接Android原生开发详解
2018/01/17 Javascript
详解js类型判断
2018/05/22 Javascript
[01:14]DOTA2 7.22版本新增神杖效果展示(智力英雄篇)
2019/05/29 DOTA
好用的Python编辑器WingIDE的使用经验总结
2016/08/31 Python
非递归的输出1-N的全排列实例(推荐)
2017/04/11 Python
20个常用Python运维库和模块
2018/02/12 Python
selenium+python设置爬虫代理IP的方法
2018/11/29 Python
python中pygame安装过程(超级详细)
2019/08/04 Python
python基于K-means聚类算法的图像分割
2019/10/30 Python
python读取图片的几种方式及图像宽和高的存储顺序
2020/02/11 Python
PyTorch中torch.tensor与torch.Tensor的区别详解
2020/05/18 Python
python类共享变量操作
2020/09/03 Python
Python中random模块常用方法的使用教程
2020/10/04 Python
Python Pandas数据分析工具用法实例
2020/11/05 Python
韩国家庭购物网上商店:Nsmall
2017/05/07 全球购物
关联、聚合(Aggregation)以及组合(Composition)的区别
2012/02/29 面试题
python使用BeautifulSoup 解析HTML
2022/04/24 Python
详解MongoDB排序时内存大小限制与创建索引的注意事项
2022/05/06 MongoDB