微信公众号调起扫码功能-蒲公英云

微信公众号调起扫码功能

朱雀 2022-05-15 00:37 540阅读 0赞

偶然接触到了公众号开发。说需要调起微信扫一扫。便查看了公众号开发文档

看完文档后，发现js是相对简单的。唯一的难点是在java后台编写的秘钥生成代码。

70 1

也就是说。首先需要获取access_token，然后在根据access_token生成签名并返回。

以下是代码

private static String GAPPID = "XXXXXXXXX";
    private static String GSECRET = "XXXXXXXXXXXXXX";
    private static String GRANTTYPE2 = "client_credential";// 获取 access-token 的
    @RequestMapping("/api/wx/getWxJsKey")
    @ResponseBody
    public String getWxJsKey(HttpServletRequest request) {
        HttpSession session = request.getSession();
        Map<String, Object> map = new HashMap<>();
        map.put("code", "1");
        map.put("errorMsg", "请求成功");
        String access_token = null;
        String jsapi_ticket = null;
        String timestamp = Long.toString(System.currentTimeMillis() / 1000);
        String noncestr = UUID.randomUUID().toString();
        System.out.println("timestamp:" + timestamp);
        System.out.println("noncestr:" + noncestr);
        // 获取 access_token
        {
            Object val = session.getAttribute("wx_access_token");
            if (val == null) {
                String requestUrl = "https://api.weixin.qq.com/cgi-bin/token?grant_type="
                        + GRANTTYPE2 + "&appid=" + GAPPID + "&secret="
                        + GSECRET;
                JSONObject json = CommonUtil.httpsRequest(requestUrl, "GET",
                        null);
                logger.info(json);
                access_token = json.getString("access_token");
                session.setAttribute("wx_access_token", access_token);
                session.setMaxInactiveInterval(7200);
            } else {
                access_token = val.toString();
            }
        }
        // 获取 ticket
        {
            Object val = session.getAttribute("jsapi_ticket");
            if (val == null) {
                String requestUrl = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token="
                        + access_token + "&type=jsapi";
                JSONObject json = CommonUtil.httpsRequest(requestUrl, "GET",
                        null);
                jsapi_ticket = json.getString("ticket");
                session.setAttribute("jsapi_ticket", jsapi_ticket);
                session.setMaxInactiveInterval(7200);
            } else {
                jsapi_ticket = val.toString();
            }
            System.out.println("jsapi_ticket:" + jsapi_ticket);
        }
        // 签名
        String jsKey = new StringBuffer()//
                .append("jsapi_ticket=").append(jsapi_ticket)//
                .append("&noncestr=").append(noncestr)//
                .append("&timestamp=").append(timestamp).append("&url=")//
                .append("https://hktest.ricepon.com/member-web/preOrderMeal/html/pre_order_meal.html")//
                .toString();
        // 加密 生成签名
        jsKey = DigestUtils.shaHex(jsKey);
        // 返回值
        Map<String, Object> param = new HashMap<>();
        param.put("jsKey", jsKey);
        param.put("timestamp", timestamp);
        param.put("noncestr", noncestr);
        param.put("appId", GAPPID);
        map.put("data", param);
        return JSONObject.fromObject(map).toString();
    }

然后在js中用ajax请求接口，处理即可。

var jsKey, noncestr, timestamp, appId, ajaxHeader = {};
$(document).ready(function () {
    //组装头部信息
    ajaxHeader = {
        Accept: "application/json; charset=utf-8",
    }
    // 获取 秘钥
    $.ajax({
        url: "../api/wx/getWxJsKey",
        type: "POST",
        headers: ajaxHeader,
        success: function (res) {
            if (res.code == 1) {
                var data = res.data;
                jsKey = data.jsKey; // 签名
                noncestr = data.noncestr; // 随机字符串
                timestamp = data.timestamp; // 时间戳
                appId = data.appId; // 小程序apId
                wx.config({
                    debug: false,
                    appId: appId,
                    timestamp: timestamp,
                    nonceStr: noncestr,
                    signature: jsKey,
                    jsApiList: ['scanQRCode']
                })
            } else {
                layer.msg(res.errorMsg);
            }
        },
        error: function (res) {
            layer.msg('error');
            layer.msg(res);
        }
    })
});
wx.error(function (res) {
    layer.msg(res.errorMsg);
});
wx.ready(function () {
    wx.checkJsApi({
        jsApiList: ['scanQRCode'],
        success: function (res) {}
    });
});
//调起扫码
function openScanDialog() {
    wx.scanQRCode({
        needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
        scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有
        success: function (res) {
            //自行处理
        }
    });
}