e2

滴滴侠,fai抖

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

 

在进行微信开发中,你时常会因为获取某些值或者配置什么设置而陷入莫名其妙的坑中,我也一样。明明觉得对的,却始终不成功,这篇文章主要总结一下我陷入的坑。

微信获取openID


在进行微信开发中,你可能会想获取用户的openID,作为用户在公众号中的唯一凭证。
官方文档中对openID是这样介绍的:为了识别用户,每个用户针对每个公众号会产生一个安全的OpenID,如果需要在多公众号、移动应用之间做用户共通,则需前往微信开放平台,将这些公众号和应用绑定到一个开放平台账号下,绑定后,一个用户虽然对多个公众号和应用有多个不同的OpenID,但他对所有这些同一开放平台账号下的公众号和应用,只有一个UnionID,可以在用户管理-获取用户基本信息(UnionID机制)文档了解详情。
也许你会在用户打开我们的网页时获取到用户的openID。
那问题来了,我们到底该怎么获取到这个openID呢?
你可以参考这地址下的文档:http://mp.weixin.qq.com/wiki/4/9ac2e7b1f1d22e9e57260f6553822520.html
获取openID的基本流程图:

这里写图片描述

  • 首先你需要获取Code

    每次获取的code只能使用一次,5分钟未被使用自动过期。
https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxf0e81c3bee622d60&redirect_uri=你要回调的的地址&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect

在上面的链接中通过设置scope的值可以改变获取方式,snsapi_base(不弹出授权页面,直接跳转,只能获取用户openid),snsapi_userinfo (弹出授权页面,可通过openid拿到昵称、性别、所在地。并且,即使在未关注的情况下,只要用户授权,也能获取其信息)。

当打开此链接时页面将跳转至 redirect_uri/?code=CODE&state=STATE。。这时上面的code便会被赋予值,这值便是我们想要的code。
- 通过Code获取openID

获取code后,请求以下链接获取access_token:

https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

如果成功返回json数据,上面便带有我们想要的openID。本人在后台开发中用到是SpringMVC技术,将就点看吧。

参考如下实例代码:

 @RequestMapping("startRegister")
    public void thCarStartRegister(Map<String, Object> map, HttpServletRequest request,Writer out) throws IOException{
        String wxcode = request.getParameter("code");
        if (wxcode != null && !"".equals(wxcode)) {// 判断微信的code是否有值
            // 微信获取用户openID
            String openID = (String) JSON.parseObject(ThcHttpUtils.thcGet(WeiXinUtils.getWXAccessUri(wxcode), ""))
            out.wirte(openID);
        } else {//没有code值重新重定向下
            return "redirect:" + WeiXinUtils.getWXCodeUri(THCarData.THCAR_URL + "startRegister");
        }
    }



    public static String getWXAccessUri(String wxcode) {
        String uri = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=" + APPID + "&secret=" + SECRET + "&code="
                + wxcode + "&grant_type=authorization_code";
        return uri;
    }

这样便能取得openID,用于我们对用户的唯一身份凭证。上面写得比较粗糙,希望对你有帮助。

在使用微信的js时,对配置的设置


可以说这东西真麻烦,一不小心你就陷入坑中。一定要详细再详细的看文档。

文档参考地址:https://mp.weixin.qq.com/wiki/11/74ad127cc054f6b80759c40f77ec03db.html

基本实现总结

1.引入js文件:在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.0.0.js

2.配置js

$(function wxconfig(){
    wx.config({
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
    appId: '', // 必填,公众号的唯一标识
    timestamp: , // 必填,生成签名的时间戳
    nonceStr: '', // 必填,生成签名的随机串
    signature: '',// 必填,签名,见附录1
    jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
    });
    wx.ready(function(){
    // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
    });
    wx.error(function(res){
    // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
    });
});


具体的了解请详情文档。这里需要特别强调的是wx.config的配置。

很有可能你会出现如下错误:

出现config:fail错误

这是由于传入的config参数不全导致,请确保传入正确的appId、timestamp、nonceStr、signature和需要使用的jsApiList

invalid signature签名错误

建议按如下顺序检查:

1.确认签名算法正确,可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 页面工具进行校验。

2.确认config中nonceStr(js中驼峰标准大写S), timestamp与用以签名中的对应noncestr, timestamp一致。

3.确认url是页面完整的url(请在当前页面alert(location.href.split(‘#’)[0])确认),包括’http(s)://’部分,以及’?’后面的GET参数部分,但不包括’#’hash后面的部分。

4.确认 config 中的 appid 与用来获取 jsapi_ticket 的 appid 一致。

5.确保一定缓存access_token和jsapi_ticket。

6.确保你获取用来签名的url是动态获取的,如上面的http://xxx.xxx.com/startRegister就是一个冬天的url。 如果是html的静态页面在前端通过ajax将url传到后台签名,前端需要用js获取当前页面除去’#’hash部分的链接(可用location.href.split(‘#’)[0]获取,而且需要encodeURIComponent),因为页面一旦分享,微信客户端会在你的链接末尾加入其它参数,如果不是动态获取当前链接,将导致分享后的页面签名失败。

7.一定要确保你进行配置的页面url与签名所用的url地址一致。如上面的配置是在http://xx.xx.com/startRegister这页面上配置的,那么你用于加密的url也要与此相同。

the permission value is offline verifying 错误

这个错误是因为config没有正确执行,或者是调用的JSAPI没有传入config的jsApiList参数中。建议按如下顺序检查:

确认config正确通过。
如果是在页面加载好时就调用了JSAPI,则必须写在wx.ready的回调中。
确认config的jsApiList参数包含了这个JSAPI。

permission denied 错误

该公众号没有权限使用这个JSAPI,或者是调用的JSAPI没有传入config的jsApiList参数中(部分接口需要认证之后才能使用)。

function not exist 错误

当前客户端版本不支持该接口,请升级到新版体验。

本人实例代码:

前台部分

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

$(function share() {
        wx.config({
            debug:true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            appId : '${WXConfig.appId}', // 必填,企业号的唯一标识,此处填写企业号corpid
            timestamp:${WXConfig.timestamp}, // 必填,生成签名的时间
            nonceStr : '${WXConfig.nonceStr}', // 必填,生成签名的随机串
            signature : '${WXConfig.signature}',// 必填,签名,见附录1
            jsApiList:${WXConfig.jsApiList} // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
        });
        wx.ready(function() {
            alert("readyOK");
            // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
        });
        wx.error(function(res) {
            alert("err:" + res.val());
            // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
        });
    });

后台部分

@RequestMapping(value = "/sharePage")
    public String thCarSharePage(Map<String, Object> map) throws Exception {
        String nonceStr = THCarUtils.getARandomString();
        String timestamp = Long.toString(System.currentTimeMillis() / 1000);
        String signature = WeiXinUtils.getWXSignature(WeiXinUtils.WEIXIN_JSAPI_TICKET, nonceStr, timestamp, SHARE_URL);
        WXJSConfig config = new WXJSConfig(WeiXinUtils.APPID, SHARE_URL, timestamp, nonceStr, signature,
                "['onMenuShareTimeline', 'onMenuShareAppMessage']");
        map.put("WXConfig", config);
        return "share/sharePage";
    }

其中WXJSConfig是自己封装的类,里面的属性与配置一致,我就不给出了。

看到这,你可能又会因为获取ACCESS_TOKEN和JSAPI_TICKET而犯愁。在官方文档中对应这两个值给出了限制,意味着你每天获取它们的次数是有上限的,我们不可以每次请求都获取一次,我们需要对它们进行缓存,你可以将其保存在数据库中,也可以直接放在内存中。下面是个人的方式,仅供参考,可能不是很合理。

public class WeiXinUtils {

public static String WEIXIN_TOKEN = "";// 注意微信TOKEN值得有效期为2小时。每日上限调用2000此,所有我们设每个小时调用一次
public static String WEIXIN_JSAPI_TICKET = "";
public static final String APPID = "wxe2b46f1dbc599123";
private static final String SECRET = "87j3a7f8f5n86764b78d8769298187c33";
private static final long TIME = 6000000;// 毫秒 ,100分钟
// private static final long TIME = 10000;
private static int i = 0;
private static boolean haveStart = false;

static {
    System.out.println("start get token");
    if (!haveStart) {// 确保只调用一次
        startChangeWXToken();
        haveStart = true;
    }
}

/**
 * 定时获取获取微信的Token值
 */
public static void startChangeWXToken() {
    TimerTask task = new TimerTask() {
        @Override
        public void run() {
            WeiXinUtils.WEIXIN_TOKEN = JSON
                    .parseObject(ThcHttpUtils.thcGet("https://api.weixin.qq.com/cgi-bin/token",
                            "grant_type=client_credential&appid=" + APPID + "&secret=" + SECRET))
                    .getString("access_token");
            startChangejsapiTicket();
        }
    };
    Timer timer = new Timer();
    timer.schedule(task, 0, TIME);
}

/**
 * 定时获取JSAPI_TICKET
 */
private static void startChangejsapiTicket() {
    boolean isOK = false;
    while (!isOK) {
        if (WEIXIN_TOKEN != null && !WEIXIN_TOKEN.isEmpty()) {
            WeiXinUtils.WEIXIN_JSAPI_TICKET = JSON
                    .parseObject(ThcHttpUtils.thcGet("https://api.weixin.qq.com/cgi-bin/ticket/getticket",
                            "access_token=" + WEIXIN_TOKEN + "&type=jsapi"))
                    .getString("ticket");
            isOK = true;
        }
    }

}
}

上面的APPID与SECRET是虚构的。上面通过定时器的方式每100分钟会调用一次方法,更新TOKEN与TICKET的值。
为了让项目部署到服务器上就是其有值,本人使用了静态块的方式,并在bean中进行声明。

<bean id="WXUtils" class="com.lihetech.thcar.util.WeiXinUtils"/>

上面这些是个人在微信开发过程中的小小总结。写的比较粗糙,希望对你由帮助。您在开发中你要确保相关公众号是正常的,相关权限有开通。所使用的域名与你在公众号中设置的一致。

 

posted on 2018-01-14 17:01  纯黑Se丶  阅读(1310)  评论(0编辑  收藏  举报