axios默认的Content-type是application/json;charset=UTF-8,如果想要以表单的形式传递参数,只要修改{headers:{'Content-Type':'application/x-www-form-urlencoded'}}配置即可。

axios.post(url,{jobNumber: '430525', password: '123'}, {headers: {'Content-Type':'application/x-www-form-urlencoded'}});

但是,改完以后发送请求,后端怎么都接收不到传过去的参数。我们打开浏览器的调试工具,可以发现这里的form Data形式的参数是将我们想要传的参数整个当成是一个key,其对应的value也是空的。

要想转化成正确的键值对形式的格式也很简单。只要用到qs库就行了,这个是axios中已经包含了的,不需要再下载相应的包了。

使用方法

import qs from 'qs';
axios.post(url,qs .stringify({jobNumber: '430525', password: '123'}), {headers: {'Content-Type':'application/x-www-form-urlencoded'}});

再次调取接口可以发现,请求参数已经是我们想要的了。

axios以form-data形式的传递参数遇到的坑的更多相关文章

  1. VUE axios 发送 Form Data 格式数据请求

    axios 默认是 Payload 格式数据请求,但有时候后端接收参数要求必须是 Form Data 格式的,所以我们就得进行转换.Payload 和 Form Data 的主要设置是根据请求头的 C ...

  2. $.ajax data向后台传递参数失败 contentType: "application/json"

    在ajax方法设置中若不添加 contentType: "application/json" 则data可以是对象: $.ajax({ url: actionurl, type: ...

  3. Scala传递参数遇到的坑

    1.方法中的参数全为val型. 例: def insertMap(map:=>Map[String,Int]):Unit={ map+=("b"->2)    //报错 ...

  4. HTTP请求中的Form Data与Request Payload的区别

    前端开发中经常会用到AJAX发送异步请求,对于POST类型的请求会附带请求数据.而常用的两种传参方式为:Form Data 和 Request Payload. GET请求 使用get请求时,参数会以 ...

  5. HTTP 请求中的 Form Data 与 Request Payload 的区别

    HTTP 请求中的 Form Data 与 Request Payload 的区别 前端开发中经常会用到 AJAX 发送异步请求,对于 POST 类型的请求会附带请求数据.而常用的两种传参方式为:Fo ...

  6. 复用$.ajax方式传递参数错误处理

    1.封装后的方法,在 data:inData 传递参数的方式和一般不一样,如果不注意会出现错误. function getDataByJsonP(methName, inData, fn) { $.a ...

  7. http 请求参数之Query String Parameters、Form Data、Request Payload

    Query String Parameters 当发起一次GET请求时,参数会以url string的形式进行传递.即?后的字符串则为其请求参数,并以&作为分隔符. 如下http请求报文头: ...

  8. AJAX POST请求中参数以form data和request payload形式在servlet中的获取方式

    转载:http://blog.csdn.net/mhmyqn/article/details/25561535 HTTP请求中,如果是get请求,那么表单参数以name=value&name1 ...

  9. [转]AJAX POST请求中参数以form data和request payload形式在servlet中的获取方式

    转载至 http://blog.csdn.net/mhmyqn/article/details/25561535 最近在写接收第三方的json数据, 因为对java不熟悉,有时候能通过request能 ...

随机推荐

  1. laravel新增路由文件

    除去原有路由文件,有时为方便路由管理,我们可以新增独立路由文件,如:针对管理后台的路由文件. 1.在routes文件夹下创建新路由文件admin.php 2.在app\Providers\RouteS ...

  2. 11. Django及数据库环境搭建

    项目背景 我们做功能测试的时候知道,一个产品基本上都会有增删改查功能,对应接口也就是增删改查接口.做了2年接口自动化测试,觉得最难的点应该是数据的初始化,其实测试一个接口.对接口使用单元测试框架.生成 ...

  3. 如何更规范化的编写JAVA 代码

    如何更规范的编写JAVA代码 一.MyBatis 不要为了多个查询条件而写 1 = 1 当遇到多个查询条件,使用where 1=1 可以很方便的解决我们的问题,但是这样很可能会造成非常大的性能损失, ...

  4. VIM 单词大小写转换

    遇到大小写转换的时候,我觉得首先一个不应该直接放弃的选择就是采用正则表达式以及文本替换功能.不过,针对单个单词的转换在VIM中还有更为简单的方式. 组合命令gUw可以实现把光标当前所在位置的一个单词转 ...

  5. SpringBoot集成Thymeleaf模板

    1.添加起步依赖: <dependency> <groupId>org.springframework.boot</groupId> <artifactId& ...

  6. 封装tab切换事件

    HTML <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

  7. python中datetime模块中strftime/strptime函数

    f==format p==parse 1.获取当前时间(日期格式) from datetime import datetime datetime.now()#输出 datetime.datetime( ...

  8. 【Luogu】【关卡2-3】排序(2017年10月) 【AK】

    任务说明:将杂乱无章的数据变得有规律.有各种各样的排序算法,看情况使用. 这里有空还是把各种排序算法总结下吧.qsort需要会写.. P1177 [模板]快速排序 这个题目懒得写了,直接sort了.. ...

  9. Eclipse快速生成一个JavaBean类的方法

    原文: https://jingyan.baidu.com/article/948f5924156866d80ff5f921.html Eclipse快速生成一个JavaBean类的方法 听语音 | ...

  10. window.navigator.userAgent

    只读属性 Window.navigator 会返回一个 Navigator 对象的引用,可以用于请求运行当前代码的应用程序的相关信息.window可以省略.来自navigator对象的信息具有误导性, ...