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

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

项目源码

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
}

实现效果