微信小程序与Java后台的通信

一、写在前面

最近接触了小程序的开发,后端选择Java,因为小程序的代码运行在腾讯的服务器上,而我们自己编写的Java代码运行在我们自己部署的服务器上,所以一开始不是很明白小程序如何与后台进行通信的,然后查找资料发现结合了官方提供的api后好像和我们普通的web前后端通信也没有多大的区别,有想法后就写了这个测试程序。

二、API文档

wx.request(OBJECT)
发起网络请求。使用前请先阅读说明。

OBJECT参数说明:
在这里插入图片描述
success返回参数说明:
在这里插入图片描述
data 数据说明:

最终发送给服务器的数据是 String 类型,如果传入的 data 不是 String 类型,会被转换成 String 。转换规则如下:

  • 对于 header[‘content-type’] 为 application/json 的数据,会对数据进行 JSON 序列化

  • 对于 header[‘content-type’] 为 application/x-www-form-urlencoded 的数据,会将数据转换成 query string (encodeURIComponent(k)=encodeURIComponent(v)&encodeURIComponent(k)=encodeURIComponent(v)…)
    示例代码

    wx.request({
       url: 'test.php', //仅为示例,并非真实的接口地址
       data: {
          x: '' ,
          y: ''
       },
       header: {
           'content-type': 'application/json' // 默认值
       },
       success: function(res) {
         console.log(res.data)
       }
     })
    

三、基本思路

将数据通过get方式传到Java servlet类,servlet得到微信小程序的数据打印出来并返回一个数据给微信小程序,从而实现一个最简单的前后端通信。

四、关键代码

微信小程序代码

index.wxml

  <view>
  <button bindtap='bindtest'>test</button>
  </view>

index.js

  bindtest: function(){
    wx.request({
      url: 'http://localhost:8080/Demo01/servlet02',
      data:{
        username:'001',
        password:'abc'
      },
      method:'GET',
      header: {
        'content-type': 'application/json' // 默认值
      },
      success:function(res){
        console.log(res.data);
      },
      fail:function(res){
        console.log(".....fail.....");
      }
    })
  },

Java serlvet类代码

  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        
        response.setContentType("text/html;charset=utf-8");          
        /* 设置响应头允许ajax跨域访问 */  
        response.setHeader("Access-Control-Allow-Origin", "*");  
        /* 星号表示所有的异域请求都可以接受, */  
        response.setHeader("Access-Control-Allow-Methods", "GET,POST");  
       
        //获取微信小程序get的参数值并打印
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        System.out.println("username="+username+" ,password="+password);
        
        //返回值给微信小程序
        Writer out = response.getWriter(); 
        out.write("进入后台了");
        out.flush();   
    }

五、效果演示

前端控制台
在这里插入图片描述
ecplise控制台
在这里插入图片描述

至此说明微信小程序与Java后台通信成功!当然这是最简单的通信,比较复杂的是需要对Json数据的处理,以后有时间再总结下。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值