首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

axios post成功,但spring-controller中未触发任何方法

问题描述: axios post成功,但spring-controller中未触发任何方法。

回答: 在这个问题中,axios是一个用于发起HTTP请求的JavaScript库,而spring-controller是Spring框架中用于处理HTTP请求的控制器。根据问题描述,axios的POST请求成功了,但在spring-controller中没有触发任何方法,这可能是由以下几个方面引起的。

  1. 请求路径不匹配:请确保axios发送的POST请求的URL与spring-controller中的请求映射路径相匹配。你可以使用Chrome浏览器的开发者工具(Network面板)来查看请求的URL,并与spring-controller中的RequestMapping注解进行比对。
  2. 请求方法不匹配:请确保axios发送的请求方法(POST)与spring-controller中的请求方法相匹配。在spring-controller的处理方法上,使用RequestMapping注解指定请求的方法,如@GetMapping、@PostMapping等。确保它们一致。
  3. 参数传递错误:请确保axios发送的请求参数正确地传递给了spring-controller中的方法。你可以使用开发者工具(Network面板)检查请求的Payload,并与spring-controller中方法的参数进行比对。也可以在spring-controller的方法参数上添加@RequestParam、@RequestBody等注解,确保参数绑定正确。
  4. CORS跨域问题:如果axios的请求与spring-controller的请求不在同一个域名下(跨域请求),请确保服务器端已经进行了CORS(跨域资源共享)的配置。可以通过在spring-controller的类或方法上添加@CrossOrigin注解来解决跨域问题。

如果你确定以上方面都没有问题,但问题仍然存在,请尝试以下步骤进行排查:

  1. 确认后端服务已经启动,并监听了正确的端口。
  2. 检查后端服务的日志,查看是否有报错信息或异常堆栈。
  3. 确认axios请求的返回状态码是否为200,可以通过查看开发者工具(Network面板)中的请求详情来获取返回状态码。

如果问题仍然无法解决,建议提供更多的代码片段或详细的错误描述,以便能够更好地帮助你解决问题。

关键词:axios、POST请求、spring-controller、请求路径、请求方法、请求参数、CORS跨域、后端服务、返回状态码。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

ajax实现步骤之XMLHttpRequest

axios 是一个基于 Promise 的http请求库,可以用在浏览器和node.js,很多不知道的是,高版本的jQuery,ajax也是一个Promise对象。...调用open方法: Open方法就是与服务器建立连接,有三个方法XMLHttpRequest.open(Method, URL, Asyn),第一个是get、post方法,第二个是地址,第三个是同步异步...回调函数onreadystatechange 当send成功发送,我们可以通过readyState来监听当前状态,readyState有五个状态: 0:初始化。尚未调用 open()方法。...已经调用 open()方法尚未调用 send()方法。 q 2:发送。已经调用 send()方法尚未接收到响应。 q 3:接收。已经接收到部分响应数据。 q 4:完成。...readyState状态切换的时候会触发onreadystatechange方法。也就是在这个方法里面判断状态是否为4。

54220

前后端交互的弯弯绕绕

": "wsm","Password": "000000"}data: 属性的信息将被包含在请求体中发送到服务器;//JSON数据请求: 注册用户信息,POST请求JSON数据;axios({...错误处理:接口请求,过程难免会遇到异常错误: axios 语法要如何处理呢?...,状态代码超出了 2xx 的范围,Axios 会捕获到一个 error.response 对象,其中包含了响应的数据、状态码和头部信息如果请求已经成功发起,没有收到响应,error.request...Promise,或者在出现错误时拒绝PromisePromise.then 方法是异步执行,当执行器执行resolve 触发回调函数;Promise.catch 方法是异步执行,当执行器执行reject...执行异步任务-并传递结果 // 成功调用: resolve(值) 触发 then() 执行 // 失败调用: reject(值) 触发 catch() 执行})// 3.

10420
  • get 和 post 重复请求详解

    如下图所示,期待的回调函数的执行顺序应是回调1 > 回调2 > 回调3,实际顺序是回调2 > 回调3 > 回调1; 增大服务器压力; 对于post请求: 服务端生成多次记录; 产生竟态,导致数据絮乱;...image.png 同时存在多个请求时,只取最新请求数据undefined当触发新的请求时,取消正在pending的请求,使得永远只有最新的请求可以最终生效。...image.png 方案1,2 时间间隔不好把控,并且因为会丢失掉部分请求,因此只能针对get请求; 方案3看起来最笨,等待时间长,请求减少,但因为他将请求排成了一个队列,所以可以避免post请求导致数据数据絮乱的情况...; 方案4的请求减少,并且实际上也无法控制该请求是否已经到达服务器,该方案保证了在前端不执行无效的响应回调; 根据项目的实际情况,我最终选择了方案4,而该方案刚好可以通过axios的 cancelToken...其中,我们可以通过axios cancelToken来取消请求 axios cancelToken axios提供了两种方法来取消请求 通过axios.CancelToken.source生成取消令牌token

    3.5K64

    【Vue_03】前后端交互

    // 请求数据 request("http://localhost/first/data").then( function(data) { // 参数1:处理请求成功方法...Promise 实例,当这个数组的 Promise 实例全部返回时,方法执行结束 race(数组) : 接收一个数组,每个数组元素都是一个 Promise 实例,当这个数组的 Promise 实例有一个返回时...的响应格式 data.json() : 将返回的数据转为 json data.text() : 将返回数据转为字符串 三、axios 1. axios的基本使用 get /delete请求 post.../put请求 2. axios全局配置 配置公共的请求头,配置之后再 url 可以省略公共的请求头 axios.defaults.baseURL = 'http://localhost/test'...; —————————— 配置超时时间 axios.defaults.timeout = 3000; —————————— 配置公共的 post 的 Content-Type axios.defaults.headers.post

    99610

    axios详解以及完整封装方法

    axios详解以及完整封装方法 一、axios是什么 Axios 是一个基于 promise 网络请求库,作用于node.js 和浏览器。...方法直接发起请求 添加请求拦截器 添加响应拦截器 导出 Promise 对象 封装 Post 方法,精简 post 请求方式 封装 Get 方法,精简 get 请求方式 请求成功,配置业务状态码 全局的...// 登录则跳转登录页面,并携带当前页面的路径 // 在登录成功后返回当前页面,这一步需要在登录页操作。...封装get方法post方法 我们常用的ajax请求方法有get、post、put等方法,相信小伙伴都不会陌生。axios对应的也有很多类似的方法,不清楚的可以看下文档。...首先我们在api.js引入我们封装的get和post方法 /** * api接口统一管理 */ import { get, post } from '.

    6.2K12

    详细自定义封装Axios请求库,你还不会二次封装吗?

    里面的stringify方法可以将一个json对象直接转为(以?和&符连接的形式)。 在开发,发送请求的入参大多是一个对象。在发送时,如果该请求为get请求,就需要对参数进行转化。...// 创建新的axios实例 const service = axios.create({ // 公共接口(暂配置,预计写死) baseURL: "http://localhost:8081/...此时这个实例service就是我们要用的axios了,你就当他是axios的对象。 请求拦截器 文档也提供了拦截器设置方法,我们调用这个方法,自己封装一下请求与响应拦截。...官方是这样写的: // 添加响应拦截器 axios.interceptors.response.use(function (response) { // 2xx 范围内的状态码都会触发该函数。...我们以post方法为例: post(url,params){ const config = { method: 'post', url:url

    5.7K40

    Java学习笔记-全栈-web开发-10-Ajax&JSON&Axios

    注意:默认方法是异步的,也就是开子线程,同步方法已经被废弃, 1.2.2 ajax准备状态码 request.readyState 0: 请求初始化 1: 服务器连接已建立 2: 请求已接收...3: 请求处理 4: 请求已完成,且响应已就绪 最常用的就是与http响应状态码“request.status == 200 && request.readyState == 4”进行请求成功与否的验证...+ params); request.send(); //get方法不需要传参,post需要 //4.监听准备状态的改变(这种写法表明:js的属性可以是方法) request.onreadystatechange...axios官网 axios中文网 5.1 简介 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 。...://unpkg.com/axios/dist/axios.min.js”> 5.2 基本使用方法 axios({ method: 'post', url: '/user/12345

    1.7K20

    让打卡小工具“智能一点”:添加请假过滤、token自动刷新

    目前我们的做法是,将需要检测打卡状态的人员(我们全组人员)的 userid 维护在一个列表,然后获取到这些人的打卡数据,从而筛选出打卡的人员。...获取请假状态的 API 如下: API 地址:${baseURL}/topapi/attendance/getleavestatus 请求方法POST 这个 API 的请求体是一个对象,对象的属性如下...userid_list: userid_list.join(), // userid 列表 offset: 0, size: 20, }; let res = await axios.post...其实和在前端项目中实现一样,在 axios 的拦截器判断 access_token 是否过期,如果过期则重新获取,然后继续执行请求。...接下来就可以在 axios 的请求拦截器获取到这个 JSON 数据,然后判断当前时间是否大于过期时间。

    67630

    揭秘简单请求与复杂请求

    另外,规范要求,对那些可能对服务器数据产生副作用的 HTTP 请求方法(特别是 GET 以外的 HTTP 请求,或者搭配某些 MIME 类型的 POST 请求),浏览器必须首先使用 OPTIONS 方法发起一个预检请求...不会触发http预检请求的便是简单请求,想法能够触发http预检请求的便是复杂请求。 那么有哪些简单请求呢?以下是来自MDN官方引用: 1、使用下列方法之一: GET、 POST、 HEAD。...XMLHttpRequestUpload 对象均没有注册任何事件监听器;XMLHttpRequestUpload 对象可以使用 XMLHttpRequest.upload 属性访问 5、请求没有使用...尽管客户端或许只请求某一方法服务端仍然可以返回所有允许的方法,以便客户端将其缓存。...这个http请求库发送了一个post请求,axios发送post请求默认会把数据转化为json格式,并且会默认设置请求头:Content-Type:application/json,很显然这是一个复杂请求

    5.6K64

    axios笔记(二) 深入了解axios

    / node 端都可以使用 支持请求 / 响应拦截器 支持请求取消 请求 / 响应数据转换 批量发送多个请求 3. axios 常用语法 axios(config):最本质的能发任何类型请求的方式...); axios.defaults.baseURL = "http://localhost:4000"; axios({ url: "/posts", method: "POST", });...而 axios()则不能,仅仅只是简单地修改 baseURL,都需要每次发送请求前重新修改,还是考虑异步的情况。...所以会先触发请求拦截器,再触发响应拦截器,经过响应拦截器后才能得到数据 3.3.4 取消请求 express 知识:Express 笔记: clz 先搭建一个服务器: const express = require...); 开启服务器, node server.js或 nodemon server.js(支持热更新) 取消请求的简单使用: 先定义一个变量 cancel,用于保存取消请求的函数 设置请求路径、请求方法

    3.1K10

    Ajax(二)

    步骤 给form注册submit事件 ==> 该事件会在表单提交的时候会触发 阻止表单的默认跳转行为 ==> 事件对象e.preventDefault() 收集表单数据 发送ajax请求提交给服务器...请求方法的别名 在实际开发,常用的 5 种请求方式分别是: GET、POST、PUT、PATCH、DELETE 为了简化开发者的使用过程,axios 为所有支持的请求方法提供了别名: axios...} }).then(result => { console.log(result) }) 体验:axios.post() // 不带请求体数据 axios.post...axios.get('/api/get').then(result => { console.log(result) // GET请求成功 }) axios拦截器 概念:...调用 FormData 对象的 append(键, 值) 方法,可以向空白的 FormData 追加键值对数据 fd.append('username' , 'admin') 注意: 键表示数据项的名字

    1.6K20

    vue 记账本

    (url[, config]) // 发送 GET 请求(默认的方法axios('/user/12345'); 请求方法的别名 为方便起见,为所有支持的请求方法提供了别名 axios.request...()和axios.get()方法进行二次封装 axios_get_post.js // eslint-disable-next-line /* eslint-disable */ // 对 axios.get...滚动该元素,当其底部与被滚动元素底部的距离小于给定的阈值(通过 infinite-scroll-distance 设置)时,绑定到 v-infinite-scroll 指令的方法就会被触发。...POST时参数也可以使用上面的KV格式存在,但是会放在报文体。 当数据量不大时,一般也会和报文头一起收到。 数据量大的时会被拆分到多个报文中。因此必须使用异步方式收取。收全后处理同GET相同。...HTTP_RAW_POST_DATA’]来接收, $HTTP_RAW_POST_DATA变量包含有原始POST数据.此变量仅在碰到识别的MIME数据时产生.

    3.6K40

    给企业微信加个群机器人

    通过向这个地址发起 POST 请求,就可以实现机器人在群里发送消息。 群机器人是要在群里才能添加的,这里有个小技巧,我们可以先拉一个群然后把别人都踢掉,这样就变成自己一个人的群了。...我这里以 node.js 为例,添加了请求库 axios 的依赖,代码如下: const axios = require('axios') axios.post('https://qyapi.weixin.qq.com...为了保证每天都能收到消息,就需要计算机一直运行这个定时任务,关机或待机的时候就收不到消息了。你可以把任务运行在服务器上,或者是用下面教大家的方法。...我们可以使用模板创建云函数,如果是添加了第三方依赖,在新建云函数时需要把 node_modules 文件夹一起打包上传。 在新建云函数的时候,提交方法选择「本地上传zip包」: ?...函数代码 main_handler 是云函数的执行入口,我们对上面知乎日报的代码做一点小小的改造,把下面代码添加到云函数的 index.js : const axios = require('axios

    6.1K33

    http网络编程(node版)

    常用http状态码 状态码描述100继续相应剩余部分200成功处理请求301资源永久移动302资源临时移动304未修改,响应不包含资源内容401授权,要求身份验证403禁止,请求被拒绝404资源不存在...500服务器内部错误503服务不可用 常用的请求方法 koa推荐用户使用REST规范,比如下面四种请求对应了增删改查: 方法接口地址描述posthttp://api.test.com/users增加用户...为了防止这种情况的发生,规范要求,对这种可能对服务器数据产生副作用的HTTP请求方法,浏览器必须先使用 OPTIONS方法发起一个预检请求,从而获知服务器是否允许该跨域请求:如果允许,就发送带数据的真实请求...使用了下面任一 HTTP 方法,都会触发预检: PUT DELETE CONNECT OPTIONS TRACE PATCH 或者人为设置了对 CORS 安全的首部字段集合之外的其他首部字段。...= true 第二次请求cookie就打印出来了。

    1.3K20

    什么样的vue面试题答案才是面试官满意的

    同理于调用 event.preventDefault() 方法.self 该指令只当事件是从事件绑定的元素本身触发时才触发回调.once 该修饰符表示绑定的事件只会被触发一次Computed 和 Methods...$refs.box获取子组件的datathis.$refs.box.msg调用子组件方法this....:"GET", // 设置请求方法 params:{ // get请求使用params进行参数凭借,如果是post请求用data type: '', page: 1 }}).then...:根据get、post方法进行一个再次封装,使用起来更为方便请求拦截器: 根据请求的请求头设定,来决定哪些请求可以访问响应拦截器: 这块就是根据 后端`返回来的状态码判定执行不同业务设置接口请求前缀利用...=utf-8' // 在开发,一般还需要单点登录或者其他功能的通用请求头,可以一并配置进来 } },})封装请求方法先引入封装好的方法,在要调用的接口重新封装成一个方法暴露出去

    2.1K30

    Axios 源码解析-完整篇

    = bind(Axios.prototype.request, context); // Axios.prototype 上的方法 (get/post...)挂载到新的实例 instance 上...this 指向 context,开发才能使用 axios.get/post… 等等 将构造函数 Axios 的实例属性挂载到新的实例 instance 上,我们开发才能使用下面属性 axios.default.baseUrl...(lib/core/Axios.js) 主要有两点: 配置:外部传入,可覆盖内部默认配置 拦截器:实例后,开发者可通过 use 方法注册成功和失败的钩子函数,比如 axios.interceptors.request.use...dispatchRequest 方法,主要做了以下操作: transformRequest: 对 config 的 data 进行加工,比如对 post 请求的 data 进行字符串化 (JSON.stringify...,调用 source 方法返回 {token, cancel},调用函数 cancel 可取消请求, axios 内部怎么知道取消请求,只能通过 { cancelToken: token } ,那 token

    1.2K30
    领券