使用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 相关文章推荐
js+css在交互上的应用
Jul 18 Javascript
那些年,我还在学习jquery 学习笔记
Mar 05 Javascript
Javascript 遍历页面text控件详解
Jan 06 Javascript
JavaScript使用Max函数返回两个数字中较大数的方法
Apr 06 Javascript
javascript运算符——逻辑运算符全面解析
Jun 27 Javascript
JavaScript学习笔记整理_setTimeout的应用
Sep 19 Javascript
JavaScript实现翻页功能(附效果图)
Feb 16 Javascript
VUE axios上传图片到七牛的实例代码
Jul 28 Javascript
原生js封装添加class,删除class的实例
Nov 06 Javascript
VueJs组件之父子通讯的方式
May 06 Javascript
vue2.0实现移动端的输入框实时检索更新列表功能
May 08 Javascript
vue插件draggable实现拖拽移动图片顺序
Dec 01 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的Yii框架中扩展的安装与使用
2016/04/01 PHP
微信随机生成红包金额算法php版
2016/07/21 PHP
EarthLiveSharp中cloudinary的CDN图片缓存自动清理python脚本
2017/04/04 PHP
深入理解JavaScript系列(13) This? Yes,this!
2012/01/18 Javascript
javascript获取设置div的高度和宽度兼容任何浏览器
2013/09/22 Javascript
Javascript中常见的校验如域名、手机、邮箱等等
2014/01/02 Javascript
网页广告中JS代码的信息监听示例
2014/04/02 Javascript
javascript常用函数归纳整理
2014/10/31 Javascript
jQuery中outerHeight()方法用法实例
2015/01/19 Javascript
浅谈js中的三种继承方式及其优缺点
2016/08/10 Javascript
jQuery事件处理的特征(事件命名机制)
2016/08/23 Javascript
Bootstrap按钮组实例详解
2017/07/03 Javascript
对vue2.0中.vue文件页面跳转之.$router.push的用法详解
2018/08/24 Javascript
layui-laydate时间日历控件使用方法详解
2018/11/15 Javascript
详解vue项目接入微信JSSDK的坑
2018/12/14 Javascript
vue cli 3.0 搭建项目的图文教程
2019/05/17 Javascript
深入剖析JavaScript instanceof 运算符
2019/06/14 Javascript
javascript实现简易的计算器
2020/01/17 Javascript
用js实现放大镜效果
2020/10/28 Javascript
在python中按照特定顺序访问字典的方法详解
2018/12/14 Python
TensorFlow基于MNIST数据集实现车牌识别(初步演示版)
2019/08/05 Python
python银行系统实现源码
2019/10/25 Python
Pytorch 保存模型生成图片方式
2020/01/10 Python
PyCharm无法引用自身项目解决方式
2020/02/12 Python
python中关于数据类型的学习笔记
2020/07/19 Python
Python hashlib模块的使用示例
2020/10/09 Python
HTML5 Canvas实现图片缩放、翻转、颜色渐变的代码示例
2016/02/28 HTML / CSS
Vans荷兰官方网站:美国南加州的原创极限运动潮牌
2018/01/23 全球购物
世界上最大的铁人三项商店:Tri UK
2020/11/04 全球购物
服装厂厂长职责
2013/12/16 职场文书
片区教研活动总结
2014/07/02 职场文书
小学国庆节活动方案策划书
2014/09/16 职场文书
担保书范本
2015/01/20 职场文书
学校学期工作总结
2015/08/13 职场文书
幼儿教师继续教育培训心得体会
2016/01/19 职场文书
Python3的进程和线程你了解吗
2022/03/16 Python