微信公众号获取openid(参考代码)

主要原理解析:

先根据是否有code来进行判断,如果有code的话,根据code换取openid,如果没有code的话,发送请求到微信授权页,微信授权页会带着code转发到当前的页面,然后根据code换取openid

==========================================================================================

wx-data.js:

var wxdata = {
    redirect_uri: window.location.href,
    openid:"",    
    openid_url :function(){
        return "http://www.badqh.cn/jeeplus_union/wx/setting/openid";
    },
    // 获取openid
    get_openid : function(){
        //若openid未过期,返回缓存的openid
        if(getCache("openid",1000*60*60*24*30)){
            return getCache("openid",1000*60*60*24*30);
        }
        
        var code = $.getUrlParam('code');
                    
        $.ajax({
            type : "GET",
            url : wxdata.openid_url(),
            data:{code:code,reUrl:wxdata.redirect_uri},
            async : false,
            success : function(rtnData) {
                //放到缓存
                console.log(rtnData);
                if(rtnData.errCode==1){
                    wxdata.openid = rtnData.data.openid;                    
                    //放到缓存
                    setCache("openid",rtnData.data.openid);
                }else if(rtnData.errCode==0){
                    //跳转页面
                    window.location.href=rtnData.data.reUrl;                    
                }else{
                    console.log(rtnData.errMsg);
                }
            
            },
            error : function(msg){
                alert("get openid  error!!! ");
            }
        });
        
        return wxdata.openid;        
    }
    //其他
}

==========================================================================================

common.js:

    /**
     * 设置缓存
     * @param {Object} key  键
     * @param {Object} value 值
     */
    function setCache(key,value){
        var curTime = new Date().getTime();
        localStorage.setItem(key,JSON.stringify({data:value,time:curTime}));
        
        console.log(key+"==>"+localStorage.getItem(key));
    }
    
    /**
     * 获取缓存
     * @param {Object} key   键
     * @param {Object} exp   1000*60*60*24  24小时
     */
    function getCache(key,exp){
        var data = localStorage.getItem(key);
        if(!data){
            return null;
        }
        var dataObj = JSON.parse(data);
        if (new Date().getTime() - dataObj.time>exp) {
            localStorage.removeItem(key);
            //alert("信息已过期")
            return null;
        }else{
            return dataObj.data;
        }
    }    
    
    /**
     * 获取永久对象
     * @param {Object} key
     */
    function getCache(key){
        var data = localStorage.getItem(key);
        if(!data){
            return null;
        }
        var dataObj = JSON.parse(data);
        
        return dataObj.data;        
    }    
    
    /**
     * 删除缓存
     * @param {Object} key
     */
    function delCache(key){
      localStorage.removeItem(key);          
    }   

==========================================================================================

get-url.js:

/*获取到Url里面的参数*/
(function($) {
    //只能是英文
    $.getUrlParam = function(key) {
        var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r != null) return unescape(r[2]);
        return null;
    }

    //可以是中文，可以是英文
    $.getCNUrlParam = function(key) {
        // 获取参数
        var url = window.location.search;
        // 正则筛选地址栏
        var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)");
        // 匹配目标参数
        var result = url.substr(1).match(reg);
        //返回参数值
        return result ? decodeURIComponent(result[2]) : null;
    }
})(jQuery);

==========================================================================================

jeeplus_union/wx/setting/openid:

    public  void openid() throws Exception   {
         
               String code=getPara("code");
               String reUrl=getPara("reUrl");
            
               Map<String ,Object> rsMap = new HashMap<String ,Object>();
                //1.根据code 获取 access_token,从而获取 openid
                //2.没有code,有refresh_token,获取openid
                //3.跳转页面，获取code
                String openid="";
                if(StringUtils.isNotEmpty(code)){
                    HttpClientUtils   httpUtils =  new HttpClientUtils();
                    //解析成Json格式
                    JSONObject jsonObject=JSONObject.fromObject(httpUtils.doGet(Constant.WEIXIN_UNIION_OAUTH2_ACCESS_TOKEN_URL+"&code="+code+"&grant_type=authorization_code"));
                    
                    if(jsonObject.containsKey("errcode")){
                        renderJson(new WxRtnMap(Integer.valueOf(jsonObject.getString("errcode")),jsonObject.getString("errmsg")));
                    }else{                
                        Redis.use("gc_wx").setex(Constant.WEIXIN_UNIION_REDIS_PREFIX+"AUTH_REFRESH_TOKEN", 7200,jsonObject.getString("refresh_token"));
                        openid = jsonObject.getString("openid");
                        rsMap.put("openid", openid);
                        renderJson(new WxRtnMap(1,"获取成功",rsMap));                
                    }
                }else if(StringUtils.isNotEmpty(reUrl)){
                    rsMap.put("reUrl", Constant.WEIXIN_UNIION_OAUTH2_AUTHORIZE_URL+"&redirect_uri="+URLEncoder.encode(reUrl,"utf8")+"&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect");
                    renderJson(new WxRtnMap(0,"跳转url",rsMap));    
                }else{
                     renderJson(new WxRtnMap(3,"出错啦"));    
                }
                
        }

==============================================================================================

Constant.java:

    //appid
    public static final String WEIXIN_UNIION_APPID = "";      
    //app_secret
    public static final String WEIXIN_UNIION_APPSECRET = "";       
    
    //oauth2-获取用户信息    
    public static final String WEIXIN_UNIION_OAUTH2_ACCESS_TOKEN_URL = Constant.WEIXIN_UNIION_ROOT_URL +
            "/sns/oauth2/access_token?appid="+WEIXIN_UNIION_APPID+"&secret="+WEIXIN_UNIION_APPSECRET;
    
    //微信接口-访问前缀
    public static final String WEIXIN_UNIION_ROOT_URL = "https://api.weixin.qq.com";       //正式地址
    
    //redis前缀
    public static final String WEIXIN_UNIION_REDIS_PREFIX = "GC_UNION_";
    
    
    public static final String WEIXIN_UNIION_OAUTH2_AUTHORIZE_URL =
            "https://open.weixin.qq.com/connect/oauth2/authorize?appid="+WEIXIN_UNIION_APPID;

================================================================================================前端页面:

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8">
        <title>水电用度查询</title>
        <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">

        <!--标准mui.css-->
        <link rel="stylesheet" href="css/mui.min.css">
        <!--App自定义的css-->
        <!--<link rel="stylesheet" type="text/css" href="../css/app.css"/>-->
    </head>

    <body>
 
         <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js" type="text/javascript" ></script>
        <script src="js/jquery.min.js"></script>
        <script src="js/common/common.js"></script>
        <script src="js/common/get-url.js"></script>
        <script src="js/common/qrcode.min.js"></script>
        <script src="js/wx-data.js"></script>
        
        <header class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
            <h1 class="mui-title">水电用度查询</h1>
        </header>
        <div class="mui-content">
                <ul class="mui-table-view mui-grid-view mui-grid-9">
                    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="webpage/activelist.html">
                            <span class="mui-icon mui-icon-home"></span>
                            <div class="mui-media-body">活动列表</div></a></li>
                    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
                            <span class="mui-icon mui-icon-email"><span class="mui-badge">5</span></span>
                            <div class="mui-media-body">问题上报</div></a></li>
                    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
                            <span class="mui-icon mui-icon-chatbubble"></span>
                            <div class="mui-media-body">获取微信头像</div></a></li>
                    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
                            <span class="mui-icon mui-icon-location"></span>
                            <div class="mui-media-body">我的</div></a></li>
                </ul>
        </div>
    </body>
    <script src="js/mui.min.js"></script>
    <script>
        mui.init({
            swipeBack:true //启用右滑关闭功能
        });
        
        $(function() {
                
                    //根据openid，获取会员信息
                    var openid = wxdata.get_openid();  //oMzRhuAauQa3kRP4DGctG8JyTON8    
                     alert("openid==>"+openid);
                    //    var
        })
    </script>
</html>

================================================================================================WxRtnMap.java

package cn.jbolt.common.model;

import java.util.Map;
 
public class WxRtnMap {

    private  Integer errCode;
    private  String  errMsg;
    private  Map<String ,Object> data;
    
    public WxRtnMap(){
        
    }
    
    public WxRtnMap(Integer errCode,String errMsg){
        this.errCode = errCode;
        this.errMsg = errMsg;
    }
    
    public WxRtnMap(Integer errCode,String errMsg,Map<String ,Object> data){
        this.errCode = errCode;
        this.errMsg = errMsg;
        this.data = data;
    }
    
    public Integer getErrCode() {
        return errCode;
    }
    public void setErrCode(Integer errCode) {
        this.errCode = errCode;
    }
    public String getErrMsg() {
        return errMsg;
    }
    public void setErrMsg(String errMsg) {
        this.errMsg = errMsg;
    }
    public Map<String, Object> getData() {
        return data;
    }
    public void setData(Map<String, Object> data) {
        this.data = data;
    }
    
}