JS-SDK配置

首先页面引入微信的js

<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>

所有需要使用JS-SDK的页面必须先注入配置信息

wx.config({
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    appId: '', // 必填，公众号的唯一标识
    timestamp: , // 必填，生成签名的时间戳
    nonceStr: '', // 必填，生成签名的随机串
    signature: '',// 必填，签名
    jsApiList: [] // 必填，需要使用的JS接口列表
});

需要我们从服务器端返回四个配置参数1:appId,2:timestamp,3:nonceStr,4:signature

jsApiList是我们需要使用的js接口列表

每一个js接口都有需要的参数，这里以分享给朋友接口为例，

wx.onMenuShareAppMessage({
title: '', // 分享标题
desc: '', // 分享描述
link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
type: '', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户点击了分享后执行的回调函数
}
});

这里大致就是两个过程，第一个过程，后台的得到config的参数传递页面渲染，第二个过程后台得到js接口需要的参数传递给页面渲染

第一个过程：比较复杂

配置微信配置参数的工具类，包括appid,screat,获取jsapi_ticket接口url，获取access_token接口api

public class WxConstUtil {
	// 微信APPID
	public static final String WX_APPID = "wxb33a5a0b283b2d7d";
	// 微信APPSECRET
	public static final String WX_APPSCREAT = "fbcec9adf0ef560d5a3fc19008a91428";
	// 微信获取jsapi_ticket 接口
	public static final String WX_JSAPI_TICKET_URL 
			= "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi";
	//微信获取access_token 接口
	public static final String WX_ACCESSTOKEN_URL
			= "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid="+WX_APPID+"&secret="+WX_APPSCREAT;
	
	public static final String TOKEN= "sgyWeixin";
}

这里从WxConstUtil（微信参数配置类）可以得到第一个参数1:appId

建立SignUtil(签名工具类) ，写一个方法createNonceStr()，通过UUID得到一个随机数，变为string,这是第二个参数2:nonceStr

public class SignUtil {
	public static String createNonceStr() {
		String s = UUID.randomUUID().toString();
		if (s.length() >= 32) {
			s = s.substring(0, 31);
		} else {
			s = s.substring(s.length() - 31);
		}
		return s;
	}
}

根据系统时间到毫秒数除于1000得到一个时间，变为string,这是第三个参数3:timeStamp

第四个参数signature提别复杂

第一步，我们需要获得access_token，微信配置参数里有个url用来获得access_token的url

//微信获取access_token 接口
public static final String WX_ACCESSTOKEN_URL
			= "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid="+WX_APPID+"&secret="+WX_APPSCREAT;

这个url请求的是微信服务器端的url,参数有三个，一个grant_type，这个不用替换，appid和secret替换为我们微信配置参数文件里的appid和secret

使用http的get请求调用此url,得到微信返回的信息，这里包含access_token的数据（附带：这里我的get请求是返回啦一个JsonObject对象，在下面有这个get请求的代码）

public class TokenUtil {
    public static String access_token="";
    /***
	 * 获取access_token
	 * @return
	 * @throws Exception
	 */
	public static String accessToken() throws Exception{
		if(access_token.equals("")){
			access_token = gainAccessTokenFromWx();
		}
		return access_token;
	}
    
   /***
	 * 从微信服务器获取 access_token
	 * @return
	 * @throws Exception
	 */
	public static String gainAccessTokenFromWx() throws Exception{	
		String url = WxConstUtil.WX_ACCESSTOKEN_URL;		
		JSONObject json = HttpUtil.doGetStr(url);
		if(json.get("errcode") != null){
			//throw new RRException("获取微信access_token失败，errcode:"+json.get("errcode"));
			throw new RuntimeException();
		}else{
			access_token = json.getString("access_token");
		}
		return access_token;
	}
}

第二步：需要获得jsapi_ticket，我们的微信配置参数里有个url是用来获得jsapi_ticket的url

// 微信获取jsapi_ticket 接口
public static final String WX_JSAPI_TICKET_URL 
			= "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi";

这个url请求的是微信服务器端的url,参数有两个，一个access_token,一个type，这个type不用替换，只需要替换access_token这个参数即可

把我们刚才得到的access_token替换为url的参数，使用http的get请求访问此url，得到返回数据，返回数据里包含jsapi_ticket的数据

public class TokenUtil {

    public static String jsapi_ticket = "";

    /***
	 * 获取jsapi_ticket
	 * @return
	 * @throws Exception
	 */
	public static String jsapiTicket() throws Exception{
		if(jsapi_ticket.equals("")){
			jsapi_ticket = gainJsapiTokenFromWx();
		}
		return jsapi_ticket;
	}   
    /***
	 * 从微信服务器获取 jsapi_ticket
	 * @return
	 * @throws Exception
	 */
	public static String gainJsapiTokenFromWx() throws Exception{
		//获取jsapi_tikcet
		String url = WxConstUtil.WX_JSAPI_TICKET_URL.replace("ACCESS_TOKEN", accessToken());		
		JSONObject res = HttpUtil.doGetStr(url);
		if(res.getInt("errcode") == 0){
			//获取jsapi_ticket成功
			String ticket = (String) res.get("ticket");
			jsapi_ticket = ticket;
		}else {
			//throw new RRException("jsapi_ticket获取失败，errmsg:"+res.getString("errmsg"));
			throw new RuntimeException();
		}
		return jsapi_ticket;
	}
}

第三步：得到signature的数据，这是我们要的

通过jsapiTicket,nonceStr,timestamp,我们微信调用的url，这四个参数得到数据，这是第四个参数4:signature

public static String jsapiSign(String jsapi_ticket, String noncestr, String timestamp, String url) {

		String str;
		str = "jsapi_ticket=" + jsapi_ticket + "&noncestr=" + noncestr + "&timestamp=" + timestamp + "&url=" + url;
		char hexDigits[] = { '0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
				'a', 'b', 'c', 'd', 'e', 'f' };
		try {
			MessageDigest mdTemp = MessageDigest.getInstance("SHA1");
			mdTemp.update(str.getBytes("GBK"));
			byte[] md = mdTemp.digest();
			int j = md.length;
			char buf[] = new char[j * 2];
			int k = 0;
			for (int i = 0; i < j; i++) {
				byte byte0 = md[i];
				buf[k++] = hexDigits[byte0 >>> 4 & 0xf];
				buf[k++] = hexDigits[byte0 & 0xf];
			}
			return new String(buf);
		} catch (Exception e) {
			// throw new RRException("jsapiSign生成config的sign错误");
			throw new RuntimeException();
		}
	}

最后把我们得到的这四个参数放入map中，返回json,通过页面的js,或ajax解析到这些数据放到config的js中，这就配置好啦wx.config的参数，就可以开发js-sdk中的需要的接口啦。

猜你喜欢