微信公众号开发之如何接入微信的SDK（二）-蒲公英云

微信公众号开发之如何接入微信的SDK（二）

前段时间做了公众号的一些开发工作，比如接入了微信的分享等功能，需要就如微信的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;
    }

三。前端引入

四。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);
                }
            }