1

使用 weixin-java-tools 完成公众端唤起微信扫一扫

如果没有引入相关的jar 可以查看之前的文章 点我

Java代码 使用 wxMpService 很方便获取一些微信需要的参数

@Autowired
    private WxMpService wxMpService;
    
    @GetMapping(path = "scannerQrcode")
    public Result scannerQrcode(HttpServletRequest request) {
        try {
            String url = request.getHeader("referer");
            WxJsapiSignature jsapiSignature = wxMpService.createJsapiSignature(url);
            return Result.success(jsapiSignature);
        } catch (Exception e) {
            e.printStackTrace();
            return Result.error("获取微信配置失败");
        }
    }

前端拿到对象后直接塞到配置中

// 这里是加载事件,加载的时候取获取参数
var data = {};
$.ajax({
            type : "get",
            url : globalUrl+"/wechatScanne/scannerQrcode",
            data : {},
            dataType : "json",
            beforeSend: function (xhr) {
                xhr.setRequestHeader("token", $.cookie("token"));
            },
            crossDomain: true,
            success:function (res) {
                data=res.data;
            }
        })

//点击事件时 填充config 并且调用扫一扫
        $("#item1 ul").on("tap",".border-orange",function(){

// 这里是个坑 ,config 一定是在参数存在后才加载,不然会出错。这里把config 放在点击事件里 而获取参数是在加载时完成的
            wx.config({
                debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
                appId: data.appId, // 必填,公众号的唯一标识
                timestamp: data.timestamp, // 必填,生成签名的时间戳
                nonceStr: data.nonceStr, // 必填,生成签名的随机串
                signature: data.signature,// 必填,签名,见附录1
                jsApiList: [
                    'checkJsApi',
                    'startRecord',
                    'stopRecord',
                    'translateVoice',
                    'scanQRCode',// 微信扫一扫接口
                    'openCard'
                ] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
            });
            
            //这里是唤醒扫一扫的代码
            wx.ready(function() {
                wx.scanQRCode({
                    needResult : 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
                    scanType : [ "qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有
                    success : function(res) {
                        var result = res.resultStr; 
                       // result 为扫描结果 
                        alert(result);
                    },
                    error : function(){
                        //console.log('123');
                        alert("错误")
                    }
                });
            });

        })

扫一扫完成。
好记性不如烂笔头记录下代码和坑...


HalloWord
41 声望2 粉丝