微信小程序wx.request实现后台数据交互功能分析


Posted in Javascript onNovember 25, 2017

本文实例讲述了微信小程序wx.request实现后台数据交互功能。分享给大家供大家参考,具体如下:

记录微信小程序wx.request这个api在跟后台交互时遇上的问题。

1、根据资料,完成第一步,请求发送,代码如下:

wx.request({
     url: 'https://localhost:8443/xiaochengxu/addBill.do',
     data: e.detail.value,
     method: 'POST',
     success:function(res) {
       console.log('submit success');
     },
     fail:function(res){
       console.log('submit fail');
     },
     complete:function(res){
       console.log('submit complete');
     }
})

后台成功接收到请求,控制台也打印了submit success和submit complete,但是,后台请求并未接收到数据,打开调试,发现数据都在request payload中,所以后台无论是springmvc的映射bean还是req.getParameter都拿不到参数。

解决方法参考本站:https://3water.com/article/129039.htm

简单说就是增加了header: {'content-type': 'application/x-www-form-urlencoded'},后台成功获取数据。

至此,代码如下:

wx.request({
     url: 'https://localhost:8443/xiaochengxu/addBill.do',
     data: e.detail.value,
     method: 'POST',
     header: {'content-type': 'application/x-www-form-urlencoded'},
     success:function(res) {
       console.log('submit success');
     },
     fail:function(res){
       console.log('submit fail');
     },
     complete:function(res){
       console.log('submit complete');
     }
})

2、接收请求返回数据

这一步问题不大,我是按照json格式返回的,只是按照官网写的console.log(res.data)的话,会在控制台打印Object,带上参数名就好了,比如res.data.code

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
Javascript和Java获取各种form表单信息的简单实例
Feb 14 Javascript
JavaScript获取URL汇总
Jun 08 Javascript
jQuery验证插件validate使用详解
May 11 Javascript
Bootstrap框架实现广告轮播效果
Nov 28 Javascript
详解JavaScript常量定义
Jan 03 Javascript
javascript基础知识之html5轮播图实例讲解(44)
Feb 17 Javascript
详解Vue中添加过渡效果
Mar 20 Javascript
在vue中安装使用vux的教程详解
Sep 16 Javascript
JS实现利用闭包判断Dom元素和滚动条的方向示例
Aug 26 Javascript
jQuery实现简单日历效果
Jul 05 jQuery
vue实现移动端项目多行文本溢出省略
Jul 29 Javascript
javascript实现雪花飘落效果
Aug 19 Javascript
利用JavaScript的%做隔行换色的实例
Nov 25 #Javascript
zTree节点文字过多的处理方法
Nov 24 #Javascript
JavaScript程序设计高级算法之动态规划实例分析
Nov 24 #Javascript
详解vue-cli脚手架build目录中的dev-server.js配置文件
Nov 24 #Javascript
javaScript和jQuery自动加载简单代码实现方法
Nov 24 #jQuery
Bootstrap modal只加载一次数据的解决办法(推荐)
Nov 24 #Javascript
浅谈vue-cli加载不到dev-server.js的解决办法
Nov 24 #Javascript
You might like
Smarty安装配置方法
2008/04/10 PHP
『PHP』PHP截断函数mb_substr()使用介绍
2013/04/22 PHP
coreseek 搜索英文的问题详解
2013/06/08 PHP
JavaScript 私有成员分析
2009/01/13 Javascript
Javascript下判断是否为闰年的Datetime包
2010/10/26 Javascript
禁止你的左键复制实用技巧
2013/01/04 Javascript
javascript 获取图片尺寸及放大图片
2013/09/04 Javascript
Web表单提交之disabled问题js解决方法
2015/01/13 Javascript
同一个网页中实现多个JavaScript特效的方法
2015/02/02 Javascript
浅谈Javascript的静态属性和原型属性
2015/05/07 Javascript
localResizeIMG先压缩后使用ajax无刷新上传(移动端)
2015/08/11 Javascript
bootstrap datetimepicker实现秒钟选择下拉框
2017/01/05 Javascript
微信小程序中子页面向父页面传值实例详解
2017/03/20 Javascript
深入理解vue2.0路由如何配置问题
2017/07/18 Javascript
解决Jquery下拉框数据动态获取的问题
2018/01/25 jQuery
在Vant的基础上实现添加表单验证框架的方法示例
2018/12/05 Javascript
如何在JavaScript中优雅的提取循环内数据详解
2019/03/04 Javascript
微信小程序如何修改本地缓存key中单个数据的详解
2019/04/26 Javascript
微信小程序 授权登录详解(附完整源码)
2019/08/23 Javascript
Python urls.py的三种配置写法实例详解
2017/04/28 Python
Python全局变量与局部变量区别及用法分析
2018/09/03 Python
pandas筛选某列出现编码错误的解决方法
2018/11/07 Python
Python中实现单例模式的n种方式和原理
2018/11/14 Python
Python实现的统计文章单词次数功能示例
2019/07/08 Python
python selenium循环登陆网站的实现
2019/11/04 Python
CSS3实现头像旋转效果
2017/03/13 HTML / CSS
Maxpeedingrods美国:高性能汽车零件
2020/02/14 全球购物
动态密码技术
2012/10/18 面试题
物业管理专业自荐信
2014/07/01 职场文书
战略合作意向书
2014/07/29 职场文书
2014年辅导员工作总结
2014/11/18 职场文书
2015年办公室文员工作总结
2015/04/24 职场文书
python开发实时可视化仪表盘的示例
2021/05/07 Python
python编程项目中线上问题排查与解决
2021/11/01 Python
Nginx隐藏式跳转(浏览器URL跳转后保持不变)
2022/04/07 Servers
nginx 添加http_stub_status_module模块
2022/05/25 Servers