vue中axios发送post请求,后端(@RequestParam)接不到参数

遇到的问题描述 :axios post 请求,后端接收不到参数。

        我们的接口是java,用@RequestParam来接收前端的参数

解决方案:使用qs;axios中已经包含有qs,所以无需重新安装,直接引入就好

import Qs from ‘qs‘//引入qs
   let chedata = {
      data: encStr,
      sign: md5.hexMD5(che),
      timestamp: timestamp,
    }
//chedata是我需要传递给后端的参数
    console.log(Qs.stringify(chedata))
    axios({
      header: {
        "Content-Type": "application/x-www-form-urlencoded;charset=utf-8"
      },
      method:method || get,
      url: baseUrl + url,
      data:Qs.stringify(chedata),//在传参之前先用qs.stringify转化一下格式
      responseType
    }).then((response) => {
      console.log(response)
      success(response.data);
    }).catch((err)=>{
      console.log(err)
    })
  }
}

  网上很多解决方案里面说还需要把请求头替换一下,但是我试了一下,替换和不替换好像没有影响;

如果需要替换的话,就将header替换为‘Content-Type‘:‘application/x-www-form-urlencoded‘

header: {
        "Content-Type": "application/x-www-form-urlencoded;charset=utf-8"
      },

  

原文地址:https://www.cnblogs.com/yutianA/p/10677677.html

时间: 2024-10-15 13:18:19

vue中axios发送post请求,后端(@RequestParam)接不到参数的相关文章

vue中采用axios发送post请求

这几天在使用vue中axios发送get请求的时候很顺手,但是在发送post请求的时候老是在成功的回调函数里边返回参数不存在,当时就纳闷了,经过查阅资料,终于得到了解决方案,在此做一总结: 首先我们在运用npm install axios的时候就会默认安装qs,因此我们就得将qs引入到axios中,然后需要再通过实例化一个新的axios,并且设置他的消息头为'content-type': 'application/x-www-form-urlencoded' 1 let qs = require

Vue--axios:vue中的ajax异步请求(发送和请求数据)

一.使用axios发送get请求 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv=&q

Vue--axios:vue中的ajax异步请求(发送和请求数据)、vue-resource异步请求和跨域

跨域原理: 一.使用axios发送get请求 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-eq

vue中axios的基本配置

vue中axios的基本配置 1.配置默认地址 axios.defaults.baseURL = ""; 2.发送数据详解 axios 使用 post 发送数据时,默认是直接把 json 放到请求体中提交到后端的.也就是说,我们的 Content-Type 变成了 application/json;charset=utf-8 ,这是axios默认的请求头content-type类型.但是实际我们后端要求的 'Content-Type': 'application/x-www-form-

聊聊 Vue 中 axios 的封装

聊聊 Vue 中 axios 的封装 axios 是 Vue 官方推荐的一个 HTTP 库,用 axios 官方简介来介绍它,就是: Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 作为一个优秀的 HTTP 库,axios 打败了曾经由 Vue 官方团队维护的 vue-resource,获得了 Vue 作者尤小右的大力推荐,成为了 Vue 项目中 HTTP 库的最佳选择. 虽然,axios 是个优秀的 HTTP 库,但是,直接在项目中使用并不是那

vue中axios 配置请求拦截功能 及请求方式如何封装

main.js 中: import axios from '................/axios' axios.js 中: //axios.js import Vue from 'vue' import axios from 'axios' Vue.prototype.$http = axios //http request 封装请求头拦截器 axios.interceptors.request.use(config => { // console.log("request&quo

vue 中axios 的基本配置和基本概念

ajax:异步请求,是一种无需再重新加载整个网页的情况下,能够更新部分网页的技术 axios:用于浏览器和node.js的基于promise的HTTP客户端 axios的安装: cmd命令行进入到vue项目下,执行npm install axios 然后执行提示npm install --save axios vue-axios 配置方法: 打开vue的编辑器,找到当前项目的main.js文件,输入: import axios from 'axios' Vue.prototype.axios =

Vue安装axios实现接口请求

一.vue-cli使用aios 1.安装命令:cnpm instal  axios --save 2.main.js引入全局使用 //axios import axios from 'axios' Vue.prototype.$axios = axios 3.组件或页面中使用 methods: { testAxios1:function(){ console.log('test'); this.$axios({ method: 'get', url: 'data/personData.json'

vue中get和post请求

vue中和后台交互,首先要引用vue-resource.js vue-resource.js是专门和后台进行交互 <!-- ==============引入vue-resource插件=================--><script src="../js/vueJs/vue-resource.js"></script> vue中get请求 function getRequest(url, params) { return new Promise