如何利用微信JSSDK调用微信扫一扫功能?具体内容如下
1. 确保有 调起微信扫一扫接口 权限,测试号可能不行;
2. 导入相关JS
<script type="text/javascript" http://test.com/zepto_touch.js"></script> <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
3. 页面触发扫码元素
<img src="../../../images/right.jpg" onclick="scanCode()" class="img">
4. 相关JS代码
<script type="text/javascript"> var _appId = "wxz88dbd30e5580e59"; var _data = { appId : _appId, url : location.href, t : Math.random() }; var _getWechatSignUrl = 'http://test.com/getWechatSign.do'; // 获取微信签名 $.ajax({ url : _getWechatSignUrl, data : _data, success : function(o) { console.log(o); if (o.returnCode == "00") { wxConfig(o.detail[0].timestamp, o.detail[0].nonceStr, o.detail[0].signature); } } }); function wxConfig(_timestamp, _nonceStr, _signature) { //alert('获取数据:'+_timestamp+'\n'+_nonceStr+'\n'+_signature); console.log('获取数据:' + _timestamp + '\n' + _nonceStr + '\n' + _signature); wx.config({ debug : true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId : _appId, // 必填,公众号的唯一标识 timestamp : _timestamp, // 必填,生成签名的时间戳 nonceStr : _nonceStr, // 必填,生成签名的随机串 signature : _signature,// 必填,签名,见附录1 jsApiList : [ 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'scanQRCode' ] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2 }); } function scanCode() { wx.scanQRCode({ needResult : 1, scanType : [ "qrCode", "barCode" ], success : function(res) { console.log(res) alert(JSON.stringify(res)); var result = res.resultStr; }, fail : function(res) { console.log(res) alert(JSON.stringify(res)); } }); } </script>
5. 获取签名接口getWechatSign.do各值生成方式
timestamp
Long timestamp = System.currentTimeMillis() / 1000;
nonceStr
String nonceStr = RandomStringUtils.randomAlphanumeric(16);
signature
public static String getSign(String jsapi_ticket, String noncestr, Long timestamp, String url) throws NoSuchAlgorithmException { String shaStr = "jsapi_ticket=" + jsapi_ticket + "&noncestr=" + noncestr + "×tamp=" + timestamp + "&url=" + url; MessageDigest mDigest = MessageDigest.getInstance("SHA1"); byte[] result = mDigest.digest(shaStr.getBytes()); StringBuffer signature = new StringBuffer(); for (int i = 0; i < result.length; i++) { signature.append(Integer.toString((result[i] & 0xff) + 0x100, 16).substring(1)); } return signature.toString(); }
6. 微信参考文档
获取access_token https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140183
获取jsapi_ticket https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持小牛知识库。
调起微信扫一扫接口 wx.scanQRCode({ needResult: 0, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果, scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有 success: function (res) { var result = res.resultStr; // 当needR
本文向大家介绍vue使用微信扫一扫功能的实现代码,包括了vue使用微信扫一扫功能的实现代码的使用技巧和注意事项,需要的朋友参考一下 第一步: 安装weixin-js-sdk 和 jquery 包 npm install weixin-js-sdk jquery 第二部: 配置wx.config (配置都是后端返回来的,菜鸟前端只需要按需传值过去就可) 代码如下 已测,可以使用 注:只能微信浏览器使
本文向大家介绍vue 使用微信jssdk,调用微信相册上传图片功能,包括了vue 使用微信jssdk,调用微信相册上传图片功能的使用技巧和注意事项,需要的朋友参考一下 vue 使用微信jssdk 1、引入weixin-js-sdk npm install weixin-js-sdk 使用文档 https://www.npmjs.com/package/weixin-js-sdk 2、配置 vue中
本文向大家介绍微信开发之微信jssdk录音功能开发示例,包括了微信开发之微信jssdk录音功能开发示例的使用技巧和注意事项,需要的朋友参考一下 项目需求简单描述 用户长按录音,松手后直接结束录音,结束录音后,用户可以选择重新录音、播放刚才的录音,上传录音(这里的上传录音指上传到自己服务器,上传步骤是,前端调用wx.uploadVoice,后台再到微信服务器下载音频文件,上传到自己的服务器)。注意,
本文向大家介绍JS判断微信扫码的方法,包括了JS判断微信扫码的方法的使用技巧和注意事项,需要的朋友参考一下 一、navagitor的userAgent属性中,判断是否含有micromessenger 二、代码 总结 以上所述是小编给大家介绍的JS判断微信扫码的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对呐喊教程网站的支持!
ap.scan(OPTION | type, CALLBACK) 调用扫一扫功能。 OPTION 参数说明 名称 类型 必填 描述 type String 否 扫描目标类型,支持 qr / bar,相应扫码选框会不同,默认 qr CALLBACK 参数说明 名称 类型 描述 code String 扫码所得数据 错误码说明 error 描述 10 用户取消 11 操作失败 代码示例 <script