实现小程序与SSM后台数据交互

简介: 该文介绍了如何实现小程序与SSM后台的数据交互。在Java控制器中,通过`@RequestMapping`注解的`queryShop`方法处理HTTP请求,设置响应头允许跨域并返回JSON格式的商品列表。小程序端使用wx.request进行GET请求,接收到数据后在控制台打印。示例还包括了传递参数的方法和展示的交互效果图片。

实现小程序与SSM后台数据交互

项目源码

@[toc]

1.controller


    @RequestMapping(value = "/queryShop",produces = "text/html;charset=utf-8")
    @ResponseBody
    public String shopList(HttpServletResponse response){
   
   
        //查询书籍
        response.setContentType("text/html;charset=utf-8");
        /* 设置响应头允许ajax跨域访问 */
        response.setHeader("Access-Control-Allow-Origin", "*");
        /* 星号表示所有的异域请求都可以接受, */
        response.setHeader("Access-Control-Allow-Methods", "GET,POST");

        //查询商品
        List<shopList> lists=shopListService.queryShopList();
        return JSONObject.toJSONString(lists);
    }

注意:@RequestMapping(value = "/queryShop",produces = "text/html;charset=utf-8")中的produces = "text/html;charset=utf-8可以防止Json数据乱码

2.小程序js

getshopList(){
   
   
  wx.request({
   
   
    url: 'http://localhost:8080/shop/queryShop',
    method:'GET',
    header: {
   
   
      'content-type': 'application/json' // 默认值
    },
    success:function(res){
   
   
      console.log(res.data);
    },
    fail:function(res){
   
   
      console.log(".....fail.....");
    }
  })
},

注意:如果页面要向后台传值,则可以在header的下面加入data:{
这里面是需要传递的值。使用键值对的形式传值 eg:username:username
}

实现效果

image.png
image.png

目录
相关文章
|
小程序
小程序提交数据到后台做加法运算
小程序提交数据到后台做加法运算
117 0
|
8月前
|
缓存 小程序 API
微信小程序页面导航与路由:实现多页面跳转与数据传递
本文深入探讨微信小程序的页面导航与路由机制,介绍多种页面跳转方式如`wx.navigateTo`、`wx.redirectTo`、`wx.switchTab`等,并讲解通过URL、全局变量和事件传递数据的方法。结合案例实现多页面跳转与数据传递,帮助开发者掌握这一重要技能。
|
8月前
|
缓存 小程序 API
微信小程序网络请求与API调用:实现数据交互
本文深入探讨了微信小程序的网络请求与API调用,涵盖`wx.request`的基本用法、常见场景(如获取数据、提交表单、上传和下载文件)及注意事项(如域名配置、HTTPS协议、超时设置和并发限制)。通过一个简单案例,演示了如何实现小程序与服务器的数据交互。掌握这些技能将帮助你构建功能更丰富的应用。
|
小程序 JavaScript 开发工具
微信小程序——全局数据共享
【10月更文挑战第5天】
|
小程序 JavaScript Java
小程序访问java后台
小程序访问java后台
96 1
|
12月前
|
小程序 安全 数据库连接
为什么已经提交的小程序无法连接后台服务?
【10月更文挑战第17天】为什么已经提交的小程序无法连接后台服务?
1126 0
|
小程序 Java
小程序通过get请求提交数据到java后台
小程序通过get请求提交数据到java后台
111 0
|
6月前
|
监控 前端开发 小程序
陪练,代练,护航,代打小程序源码/前端UNIAPP-VUE2.0开发 后端Thinkphp6管理/具备家政服务的综合型平台
这款APP通过技术创新,将代练、家政、娱乐社交等场景融合,打造“全能型生活服务生态圈”。以代练为切入点,提供模块化代码支持快速搭建平台,结合智能匹配与技能审核机制,拓展家政服务和商业管理功能。技术架构具备高安全性和扩展性,支持多业务复用,如押金冻结、录屏监控等功能跨领域应用。商业模式多元,包括交易抽成、增值服务及广告联名,同时设计跨领域积分体系提升用户粘性,实现生态共生与B端赋能。
563 12
|
9月前
|
移动开发 小程序
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
372 0
|
11月前
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
232 0
在线课堂+工具组件小程序uniapp移动端源码