今天有人遇到接口调用不通的情况,粗略看了一下是axios跨域请求引起了。找到问题,处理就简单多了。

但是我看其代码,发现比较有意思

export function agentlist(query) {
return request({
url: /agent/list',
method: 'get',
params: query
})
}
export function editagent(data) {
return request({
url: '/agent/editagent',
method: 'post',
data:data
})
}
export function deleteagent(id) {
return request({
url: '/agent/delete',
method: 'post',
params:{id}
})
}

上面的代码中的request是axios实例,同是post却出现了data或params做数载体的情况。凭直觉该代码会在后续请求中出现问题,果不其然后续出现各种问题。

出现的问题主要是:前端传递参数给了springboot程序,但是程序中却接收不到数据或只接收到部分数据。出现问题前后端代码如下:

前端:

export function login(account, password, orgType) {
return request({
url: '/webapi/login',
method: 'post',
data: {"loginId":account,"password":password,"orgType":orgType}
)}

后端:

@PostMapping(value = "/login")
public Result login(String loginId, String password, int orgType, HttpServletResponse response){
}

程序运行异常:

java.lang.IllegalStateException: Optional int parameter 'orgType' is present but cannot be translated into a null value due to being declared as a primitive type. Consider declaring it as object wrapper for the corresponding primitive type.

问题分析:

出现异常的原因看似orgType无法转换为对象类型引发的,真实情况并非如此。真正的原因是Java中的代码根本就无法获取到3个参数,前两个是String类型在无法获取参数的情况下会被赋值为null,第三个参数因是 int 类型,因无法赋值为null,故引发该异常。出现异常并非Java代码写得不好,而是前后台传参衔接出了问题。

前端数据发送网络请求,注意下面的数据的格式:

前端数据确实发送了,但是数据的格式为json格式。

服务器端POST请求获取参数,要求的参数格式为:key=value&key2=value2&key.....,因此服务器端无法获取数据也就好理解了。

解决上述解决方案:

前端解决方案1

export function login(account, password, orgType) {return request({
url: '/webapi/login',
method: 'post',
data: "loginId="+account+ "&password="+password+"&orgType="+orgType
})
}

手动构造服务器端需要的数据格式,此时再次执行客户端程序,并跟踪网络请求如下图,springboot程序正常获取到数据。

上面这种方案虽能解决问题,但太机械,用来分析问题可以,生产中就行不通了。

前端方案2

export function login(account, password, orgType) {
return request({
url: '/webapi/login',
method: 'post',
params: {"loginId":account, "password":password,"orgType":orgType}
})
}

将 axios 中的参数载体由 data 改为 params,此时再次执行客户端程序,并跟踪网络请求如下图,springboot程序正常获取到数据。

上面这种解决方案,将要发送的数据对象以params做载体发送时,axios会把数据对象的属性与值拼成 k=v&k=v 格式,但这些数据是作为 Query String(放在url中的参数) 传递给后台程序的,因此并非真正意义上post传参(实际是post方式向增加了参数url地址,提交空数据

axios 用 params/data 发送参数给 springboot controller,如何才能正确获取的更多相关文章

  1. 深入requests库params|data|json参数

    深入requests库params|data|json参数 一.params params:字典或者字节序列,作为参数增加到URL中.不仅访问URL,还可以向服务器携带参数. 简单来讲也就是说对于原来 ...

  2. 【axios】get/post请求params/data传参总结

    axios中get/post请求方式 1. 前言 最近突然发现post请求可以使用params方式传值,然后想总结一下其中的用法. 2.1 分类 get请求中没有data传值方式 2.2 get请求 ...

  3. vue中配置axios.js文件,发送请求

    为了统一管理请求,每个项目都会去配置axios:而不是在vue中直接使用,那样不好维护等等 下面是我配置的最基础的axios文件 第一步:首先新建一个axios文件,我是放在router文件下的 im ...

  4. 把axios挂载到vue实例上面/==Axios 各种请求方式传递参数格式

    /*ajax请求*/   import axios from 'axios'   axios.defaults.baseURL = 'https://api.douban.com/v2/movie' ...

  5. 2019.03.29 读书笔记 关于params与可选参数

    void Method1(string str, object a){} void Method2(string str, object a,object b) { } void Method3(st ...

  6. Axios 各种请求方式传递参数(非axios api 请求方式)

    get delete 方法较为不同 get请求方式将需要入参的数据作为 params 属性的值,最后整体作为参数传递 delete请求方式将将需要入参的数据作为 data 属性的值,最后整体作为参数传 ...

  7. 函数,参数数组params与数组参数,结构函数

    1.函数 static 返回值类型 函数名(形参1,形参2,...){        函数体;        return 返回值; } 无返回值,则static void 函数名(){ } stat ...

  8. delphi使用SQL的教程4(使用Params属性为参数赋值 )

    17.4.1 使用Params属性为参数赋值   TQuery部件具有一个Params属性,它们在设计时不可用,在程序运行过程中可用,并且是动态建立的,当为TQuery部件编写动态SQL 语句时, D ...

  9. 编写高质量代码改善C#程序的157个建议——建议98:用params减少重复参数

    建议98:用params减少重复参数 如果方法的参数数目不定,且参数类型一致,则可以使用params关键字减少重复参数声明. void Method1(string str, object a){} ...

随机推荐

  1. python之pandas学习笔记-初识pandas

    初识pandas python最擅长的就是数据处理,而pandas则是python用于数据分析的最常用工具之一,所以学python一定要学pandas库的使用. pandas为python提供了高性能 ...

  2. hadoop java VM 参数设置 默认native栈大小设置

    问题总结: 程序栈太小,64位机器的栈大小默认比32位的大,将程序从64放到32中执行则报错,需要修改初始堆栈大小 (.so库中提供两个函数接口,一个里面使用的是尺寸较大的图像,另一个处理的图像很小, ...

  3. elasticsearch 的post put 方式的对比 setting mapping设置 - 添加查询数据

    1.POST和PUT都可以用于创建 2.PUT是幂等方法,POST不是.所以post用户更新,put用于新增比较合适. 参考:https://yq.aliyun.com/articles/366099 ...

  4. eNSP——Hybrid接口的应用

    原理: Hybrid接口既可以连接普通终端的接入链路又可以连接交换机间的干道链路,它允许多个VLAN的帧通过,并可以在出接口方向将某些VLAN帧的标签剥掉. Hybrid接口处理VLAN帧的过程如下: ...

  5. 记录下为了玩 docker 安装 CentOS 7 最简化版后遇到的一些问题

    今天我的腾讯云服务器在使用docker安装ElasticSearch和Kibana的时候内存不够,安装完直接卡死.所以无奈只能在本地上跑VMWare安装CentOS7来运行测试. 从阿里云镜像地址:h ...

  6. Holy Grail【spfa求最短路】

    题目链接:https://www.jisuanke.com/contest/3004?view=challenges 题目大意: 1.一个无向图,给出六个顶点,添六条边,但是添边是有限制的.每次添边的 ...

  7. Json乱码解决统一代码

    我们在springmvc中使用json经常出现乱码格式  如下图: 我们可以在@RequestMapping()中配置,produces = "application/json;charse ...

  8. HanLP-基于HMM-Viterbi的人名识别原理介绍

    Hanlp自然语言处理包中的基于HMM-Viterbi处理人名识别的内容大概在年初的有分享过这类的文章,时间稍微久了一点,有点忘记了.看了 baiziyu 分享的这篇比我之前分享的要简单明了的多.下面 ...

  9. EXCEL 查找某个字符在字符串中最后一次出现的位置

    在EXCEL文档里想从很长的文件路径中取得文件名,[数据]→[分列]是个不错的选择,但用函数会显得更高大上一些. 首先,需要获取最后一个"\"所在的位置. 方法1: FIND(&q ...

  10. linux利用crontab添加定时任务详解

    crontab 作用:添加,查询,删除系统计划任务的指令. [root@localhost ~]# crontab [选项]选项:    -e:    编辑crontab定时任务    -l:    ...