微信小程序万里目_微信小程序与Java后台的通信

一、写在前面

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

二、API文档

wx.request(OBJECT)

发起网络请求。使用前请先阅读说明。

OBJECT参数说明：

参数名类型必填默认值说明

url

String

是

开发者服务器接口地址

data

Object/String

否

请求的参数

header

Object

否

设置请求的 header，header 中不能设置 Referer。

method

String

否

GET

(需大写)有效值：OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT

dataType

String

否

json

如果设为json，会尝试对返回的数据做一次 JSON.parse

success

Function

否

收到开发者服务成功返回的回调函数

fail

Function

否

接口调用失败的回调函数

complete

Function

否

接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明：

参数类型说明最低版本

data

Object/String

开发者服务器返回的数据

statusCode

Number

开发者服务器返回的 HTTP 状态码

header

Object

开发者服务器返回的 HTTP Response Header

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

test

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) throwsServletException, 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数据的处理，以后有时间再总结下。