您好,登录后才能下订单哦!
这篇文章主要介绍了vue使用$http服务端收不到参数怎么办,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。
一:望
在浏览器中把这个功能跑一下,打开调试窗口,找到这个XHR(XMLHttpRequest)请求连接,看Headers选项卡最下面,如下图所示
Request Payload,请注意这个数据格式。
二:闻
打开伊万卡小妹写的代码,我终于看出了传说中诗的感觉,同样26个字母,小妹敲出来的就是好看。
this.$vux.confirm.show({ title: "提示", content: "确定要删除此图片吗?", onConfirm() { that.$http({ method: "post", url: `${that.$$baseURL}/upload/delBelowImg`, headers: { token: token, 'Content-Type':'application/json' }, data:{ file:item.filePath, id:id, name:item.name } }).then(res => {}); } });
我发誓,以上代码绝对出自伊万卡之手,分毫未改。但当这个片段出现在我博文里时屁感觉没有,你说奇怪不奇怪。
三:问
我转头看向写java的川普,说:“小川,把你和伊万卡小妹对接的这个接口,代码发我一下”。5秒中之后,我收到了如下毫无美感的代码。
@RequestMapping(value = "/delBelowImg") @Transactional public void delBelowFile(@RequestParam Map<String, Object> params,HttpServletRequest request){ try { …… } catch (Exception e) { …… } }
@RequestParam 注意这个注解。
四:切
到这里我已经确切的知道了病因,我略作分析,在望环节,我们看到伊万卡小妹诗一样的代码发出请求,在浏览器发送请求参数格式是:
Request Payload,在问环节,看到小川写的代码,注解是@RequestParam,所以结果是,小妹发送的请求数据格式与小川的不统一,怪不得接受不到参数。
我在小妹的代码基础上略作改动如下(标红是改动部分):
const data = { file:item.filePath, id:id, name:item.name } this.$vux.confirm.show({ title: "提示", content: "确定要删除此图片吗?", onConfirm() { that.$http({ method: "post", url: `${that.$$baseURL}/upload/delBelowImg`, headers: { token: token, 'Content-Type':'application/json' }, params:data }).then(res => {}); } });
我再次打开浏览器,这次发送参数的格式成了 Query String Parameters,如下图所示
服务端成功接受到了参数,图片正常删除。
感谢你能够认真阅读完这篇文章,希望小编分享的“vue使用$http服务端收不到参数怎么办”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。