在使用axios时,注意到配置选项中包含params和data两者,以为他们是相同的,实则不然。 

因为params是添加到url的请求字符串中的,用于get请求。 

而data是添加到请求体(body)中的, 用于post请求。

比如对于下面的get请求:
axios({
method: "get",
url: "http://www.tuling123.com/openapi/api?key=20ff1803ff65429b809a310653c9daac",
params: {
info: "西安天气"
},
})
如果我们将params修改为data,显然是不能请求成功的,因为get请求中不存在data这个选项。

1、HTTP请求过程中,get请求:表单参数以name=value&name1=value1的形式附到url的后面;

2、post请求:表单参数是在请求体中,也是name=value&name1=value1的形式在请求体中。
POST表单请求提交时,使用的Content-Type是application/x-www-form-urlencoded,而使用原生AJAX的POST请求如果不指定请求头RequestHeader,默认使用的Content-Type是text/plain;charset=UTF-8。
在html中form的Content-type默认值:Content-type:application/x-www-form-urlencoded
如果使用ajax请求,在请求头中出现 request payload导致参数的方式改变了 ,那么解决办法就是:
headers: {'Content-Type':'application/x-www-form-urlencoded'}
或者使用ajax设置:
$.ajaxSetup({contentType: 'application/x-www-form-urlencoded'});

注意:
params 和 data 对象传参数给后台时:字段名(key)不需要用let定义的,直接写就可以了,但是value是变量一定要定义

id ,city ,plot , groupName都是字段名(key)不用定义

 

Axios发送请求时params和data的区别的更多相关文章

  1. 发送请求时params和data的区别

    在使用axios时,注意到配置选项中包含params和data两者,以为他们是相同的,实则不然. 因为params是添加到url的请求字符串中的,用于get请求. 而data是添加到请求体(body) ...

  2. System.Data.SqlClient.SqlException: 在向服务器发送请求时发生传输级错误。 (provider: TCP 提供程序, error: 0 - 远程主机强迫关闭了一个现有的连接。) .

    今天使用sql server 2008 R2管理器,进行SQL查询时,频率非常高的报错: System.Data.SqlClient.SqlException: 在向服务器发送请求时发生传输级错误. ...

  3. 发送请求时携带了参数,但是浏览器network没有显示的排错思路

    发送请求时携带了参数,但是浏览器network没有显示的排错思路 不知道大家有没有遇到这样子的情况就是发送请求的时候明明携带了参数,但是浏览器的network中就是没有!请看下图和代码! 我发送请求用 ...

  4. Vue项目中使用Vuex + axios发送请求

    本文是受多篇类似博文的影响写成的,内容也大致相同.无意抄袭,只是为了总结出一份自己的经验. 一直以来,在使用Vue进行开发时,每当涉及到前后端交互都是在每个函数中单独的写代码,这样一来加大了工作量,二 ...

  5. vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete)

    vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete) 手把手式笔记 Axios配置 安装 axios ...

  6. 在向服务器发送请求时发生传输级错误。 (provider: TCP 提供程序, error: 0 - 远程主机强迫关闭了一个现有的连接。)

    用VS2005+SQLSERVER2008开发C/S的程序,程序上线运行一段时间之后发现在某些功能偶尔出现如下的错误: 在向服务器发送请求时发生传输级错误. (provider: TCP 提供程序, ...

  7. 在向server发送请求时发生传输级错误。 (provider: 共享内存提供程序, error: 0 - 管道的还有一端上无不论什么进程。

    作者:卿笃军 原文地址:http://blog.csdn.net/qingdujun/article/details/36425825 SQL Server 2008 + VS2010 用C#编写的代 ...

  8. 使用 IE 或Chrome等浏览器,通过网络抓包的形式,查看发送请求时的网络

    要求: 使用 IE 或Chrome等浏览器,通过网络抓包的形式,查看发送请求时的网络 实现步骤: 1.打开 IE 浏览器,选择"开发者工具",切换到"网络"标签 ...

  9. axios发送POST时请求两次,第一次为OPTIONS

    出现问题: 发送POST请求时浏览器产生两次请求,第一次为OPTIONS,第二次是真正的POST请求,后台接收不到参数. 查找原因: 非GET请求,会先发送OPTIONS进行预检(预检请求每次运行只发 ...

随机推荐

  1. Java基础之基本数据类型

    前言:Java内功心法之基本数据类型,看完这篇你向Java大神的路上又迈出了一步(有什么问题或者需要资料可以联系我的扣扣:734999078) 变量就是申请内存来存储值.也就是说,当创建变量的时候,需 ...

  2. Spring之Bean的作用域与生命周期

    在前面博客中提到容器启动获得BeanDefinition对象中有一个scope 属性.该属性控制着bean对象的作用域.本章节介绍Bean的作用域及生命周期,了解bean是怎么来的又怎么没的. 一.B ...

  3. SPI Flash(W25Q16DV) 驱动

    大体上可分为以下几个部分: 1.注册设备驱动 spi_register_driver 2.分配 mtd_info 结构体 3.配置 mtd_info 结构体 4.注册 mtd_info 结构体 构建 ...

  4. js------数组随机排序和去重

    let arr = ['g', 'b', 'c', 'd', 'e', 'a', 'g', 'b', 'c']; // 数组随机排序(原数组被修改)Array.prototype.randomSort ...

  5. 【协议】5、gossip 协议

    Gossip是一种去中心化.容错并保证最终一致性的协议. Background:分布式环境 Gossip是为了解决分布式遇到的问题而设计的.由于服务和数据分布在不同的机器上,节点之间的每次交互都伴随着 ...

  6. 写出java8实现对List<User>中的username字段过滤出不等于张三的数据

    写出java8实现对List<User>中的username字段过滤出不等于张三的数据... 对...这个是一道面试题.当时没有看过java8的新特性...所以有点懵. 看完之后感觉 真. ...

  7. java-两个整数变量的交换-不需要定义第三方变量

    代码如下: class Example { public static void main(String[] args) { /* * 位异或运算符的特点 * ^的特点:一个数据对另一个数据位异或两次 ...

  8. canvas-0translate.html

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. layer.open

    1.type-基本层类型 类型:Number,默认:0 layer提供了5种层类型.可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层). 若你采用layer. ...

  10. 【读书笔记】iOS-访问网络

    iOS平台是按照一直有网络连接的思路来设计的,开发者利用这一特点创造了很多优秀的第三方应用.大多数的iOS应用都需要联网,甚至有些应用严重依赖网络,没有网络就无法正常工作. "在访问网络失败 ...