当前位置:网站首页 > Vue.js开发 > 正文

vue post application/x-www-form-urlencoded传参的解决方案

在使用axios进行参数获取时,始终获取不到,但是调用postman是正常的,所以初步估计是参数格式不正确,那么正确的应该怎么写呢?

一般按照正常的逻辑,我们在传递application/x-www-form-urlencoded时,参数应该这样写,但实际操作中发现一只获取不到参数。

axios .create({ baseURL: 'url', timeout: 10000, headers: { 'Content-Type': 'application/json' }, }) .post( 'xxx/xxx/xxx', JSON.stringify({ name: '', age: 12, }), { headers: { 'Content-Type': 'application/x-www-form-urlencoded', }, } ) .then(function(response) { console.log(JSON.stringify(response)) }) .catch(function(error) { console.log(error) })

方法一:添加两句代码,就可以正常获取

var qs = require('qs');

然后把JSON.strinify改为qs.stringify就可以了。

const qs = require('qs') axios .create({ baseURL: 'url', timeout: 10000, headers: { 'Content-Type': 'application/json' }, }) .post( 'xxx/xxx/xxx', qs.stringify({ name: '', age: 12, }), { headers: { 'Content-Type': 'application/x-www-form-urlencoded', }, } ) .then(function(response) { console.log(JSON.stringify(response)) }) .catch(function(error) { console.log(error) })

方法二:开发中遇到的post请求头application/x-www-form-urlencoded的请求(URLSearchParams来解析)

api中定义

new一个URLSearchParams把需要的传参append添加进去,就可以获得data了

const param = new URLSearchParams(); param.append("merchantId", merchantId); param.append("no", no); const data = await apiOrder(param) if(data.code==200){ this.$toast.success('确认订单开机成功') }else{ this.$toast.fail('开机失败') }

 

到此这篇vue post application/x-www-form-urlencoded传参的解决方案的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!

版权声明


相关文章:

  • vue安装npm时遇到 npm ERR! syscall rename npm ERR!错误解决办法2024-12-03 13:45:08
  • js事件循环机制-宏任务微任务2024-12-03 13:45:08
  • 对修饰器的实验支持功能在将来的版本中可能更改。在 “tsconfig“ 或 “jsconfig“ 中设置 “experimentalDecorators“ 选项以删除此警告。ts(1219)2024-12-03 13:45:08
  • vue-cli2.0webpack的理解2024-12-03 13:45:08
  • vue3初探-工程化项目架构-笔记2024-12-03 13:45:08
  • 移动端兼容安卓456实现0.5像素边框2024-12-03 13:45:08
  • VUE实现吸底2024-12-03 13:45:08
  • VUE页面不刷新时调用forceUpdate即可2024-12-03 13:45:08
  • vue mint-ui中swipe高度自适应2024-12-03 13:45:08
  • VUE手写实现移动端el-table组件2024-12-03 13:45:08
  • 全屏图片