在使用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. myeclipse 添加mybatis generator插件

    在红色的方框中输入下面的网址,一直下一步,最后finish即可. https://dl.bintray.com/mybatis/mybatis-generator/

  2. Linux下lz4解压缩命令小结

    lz4是一个让"人见人爱.花见花开"的压缩算法,能够在多核上很好的扩展.lz4在压缩率上略微逊色, 但是在解压速度上有着惊人的优势 (大概是gzip的3倍(多次测试对比)).因为压 ...

  3. 通过 URL 打开 Activity

    为每个 Activity 绑定一个 url 可以方便的让第三方 app 直接打开这些 Activity.也可以方便在 app 内部进行页面跳转,解耦. 背景 举一个常见的案例,假设我们有个产品 A,产 ...

  4. C++注入记事本

    #include <iostream>; using namespace std; #include <windows.h>; #include <tlhelp32.h& ...

  5. 微信小程序开发BUG经验总结

    摘要: 常见的微信小程序BUG! 小程序开发越来越热,开发中遇到各种各样的bug,在此总结了一些比较容易掉进去的坑分享给大家. 1. new Date跨平台兼容性问题 在Andriod使用new Da ...

  6. HDU6205

    card card card Time Limit: 8000/4000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)To ...

  7. setTimeout.js

    var cyn = function(){ console.log("我是延时输出的函数") } setTimeout(cyn,5000)

  8. 从输入url到页面展示到底发生了什么

    阅读目录 1.输入地址 2.浏览器查找域名的 IP 地址 3.浏览器向 web 服务器发送一个 HTTP 请求 4.服务器的永久重定向响应 5.浏览器跟踪重定向地址 6.服务器处理请求 7.服务器返回 ...

  9. loadrunner 结果分析-loadrunner结果分析

    结果分析-loadrunner结果分析 by:授客 QQ:1033553122 百度网盘分享链接: 烦请 复制一下网址到浏览器中打开,输入密码提取 链接: http://pan.baidu.com/s ...

  10. MVC与单元测试实践之健身网站(完)-备案与部署

    主页-http://www.zhixin9001.cn/Home/Introduce GitHub- https://github.com/zhixin9001/Fitness 这是关于Fit网站的最 ...