前段时间做了公众号的一些开发工作,比如接入了微信的分享等功能,需要就如微信的JS-SDK,这段时间程序出了一点小小的bug,故重头把这一块缕了一下,做一个总结,方便他们看,也方便自己以后复习。


一。准备工作

1.首先根据微信开发文档介绍,要想接入微信的sdk需要做一些签名的认证,此签名认证需要用到微信服务器token和服务器ticket

2.那么何谓服务器token呢,我这里将他谢伟服务器token是因为跟有一个临时token做区分的,服务器token是通过appid和appsecret获取到的,

3.临时的token是微信获取个人信息时,由微信的一个code来获取临时的token,再有这个临时的token获取用户的信息

4.此处的ticket是为了做shar1签名用的

5.根据接口将服务器token和ticket获得之后存放到数据库中,因为获取token和获取ticket的接口是有限的,故要存起来


二。然后再java层进行签名

public RemoteResponse initJSSDK(RemoteRequest request){
		logger.info("进入WeixinJSSDKAction--initJSSDK");
		logger.debug("进入WeixinJSSDKAction--initJSSDK--debug");
		RemoteResponse response = null;
		DBAction db = null;
		try {	
			String url = request.getParameter("url");
			url = java.net.URLDecoder.decode(url, "UTF-8");
			logger.info("initJSDate--url:"+url);
			String appId = "wx4c479737c9f2877c";//写死 因为这次活动是心聆家塾订阅号的活动,使用的心聆家塾的接口权限,此为心聆家塾的appId
			//1.获得token
			db = RemoteService.getDbInfo().createDBAction();
			db.openTransaction();
			//TODO
			//暂时写死
			long schoolRI = 100010;//写死 因为这次活动是心聆家塾订阅号的活动,使用的心聆家塾的接口权限
			logger.info("schoolRI(真实的):"+schoolRI);
			
			String access_token  = "";
			String jsapi_ticket  = "";
			
			
			Map<String, String> map_school = db.queryMap("select weixin_access_token, weixin_jsapi_ticket from edu_school where ri="+schoolRI+"");
			if(map_school == null){
				throw new Exception("您现在不属于任何学校");
			}else{
				if(map_school.containsKey("WEIXIN_ACCESS_TOKEN") && map_school.containsKey("WEIXIN_JSAPI_TICKET")){
					access_token  = map_school.get("WEIXIN_ACCESS_TOKEN");
					jsapi_ticket  = map_school.get("WEIXIN_JSAPI_TICKET");
				}
			}
			
			logger.info("access_token:"+access_token);
			logger.info("jsapi_ticket:"+jsapi_ticket);
			db.commitTransaction();
			Map<String, String> map = Sign.sign(jsapi_ticket, url);
			//6.获得jsApiList接口列表
			List<String> jsApiList = new ArrayList<String>();
			jsApiList.add("startRecord");
			//jsApiList.add("stopRecord");

			logger.info("--------------------------");
			logger.info("access_token:"+access_token);
			logger.info("jsapi_ticket:"+jsapi_ticket);
			logger.info("nonceStr:"+map.get("nonceStr"));
			logger.info("timestamp:"+map.get("timestamp"));
			logger.info("signature:"+map.get("signature"));	
			logger.info("--------------------------");
			
			response = new RemoteResponse(request, 0, null);
			
			String errorCode = "0";
			if(map_school.get("WEIXIN_JSAPI_TICKET").isEmpty()){
				errorCode = "-1";
			}
			response.setAttribute("appId", appId);
			response.setAttribute("timestamp", map.get("timestamp"));
			response.setAttribute("nonceStr", map.get("nonceStr"));
			response.setAttribute("signature", map.get("signature"));
			response.setAttribute("jsApiList", jsApiList);
			response.setAttribute("errorCode", errorCode);
		} catch (Exception e) {
			logger.error("处理错误", e);			
			response = new RemoteResponse(request, e);
			
		}
		return response;
	}



三。前端引入<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>


四。init函数中的访问刚刚的java接口

function init(){
				alert("pic_upload.jsp---init");
				try {
					var url = getUrl();
					alert("URL:"+url);
        			$.get("<%=ermRestApiUrl%>", {service:"WeixinJSSDKAction", method:"initJSSDK", url: ""+url+""}, function(resp){
        				if(resp.returnCode!=0){
            				alert(resp.returnMessage);
            				return;
            			}
        				var appId = resp.result.appId;
        				var timestamp = resp.result.timestamp;
        				var nonceStr = resp.result.nonceStr;
        				var signature = resp.result.signature;
        				var errorCode = resp.result.errorCode;
        				
        				if(errorCode != "-1"){
        					wx.config({
        			            debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
        			            appId: appId, // 必填,公众号的唯一标识
        			            timestamp: timestamp, // 必填,生成签名的时间戳
        			            nonceStr: nonceStr, // 必填,生成签名的随机串
        			            signature: signature,// 必填,签名,见附录1
        			            jsApiList: [
        							'checkJsApi',
        							'onMenuShareTimeline',
        							'onMenuShareAppMessage',
        							'onMenuShareQQ',
        							'onMenuShareWeibo',
        							'onMenuShareQZone',
        							'translateVoice',
        							'startRecord',
        							'stopRecord',
        							'closeWindow',
        							'getNetworkType'
        			                        ] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
        			        });
        					wx.ready(function() {
        						//下句是为了解决苹果手机打开页面不自动播放音频的问题
        						alert("成功了");
        					});
        					
        					wx.error(function (res) {
        						alert("失败了");
        		    	    });
        					
        				}
        			});
				} catch (e) {
					alert(e.message);
				}
			}