微信JSSDK调用微信扫一扫功能的方法


Posted in Javascript onJuly 25, 2017

如何利用微信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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery中通过父级查找进行定位示例
Jun 28 Javascript
javascript读写XML实现广告轮换(兼容IE、FF)
Aug 09 Javascript
ExtJS 刷新后如何默认选中刷新前最后一次选中的节点
Apr 03 Javascript
javascript+HTML5的Canvas实现Lab单车动画效果
Aug 07 Javascript
javascript实现省市区三级联动下拉框菜单
Nov 17 Javascript
详解Angular.js的$q.defer()服务异步处理
Nov 06 Javascript
详解Bootstrap各式各样的按钮(推荐)
Dec 13 Javascript
Node.js使用Express创建Web项目详细教程
Mar 31 Javascript
微信小程序组件之srcoll-view的详解
Oct 19 Javascript
Javascript的console['']常用输入方法汇总
Apr 26 Javascript
vue 中动态绑定class 和 style的方法代码详解
Jun 01 Javascript
vue ref如何获取子组件属性值
Mar 31 Vue.js
利用node.js爬取指定排名网站的JS引用库详解
Jul 25 #Javascript
详解angularjs获取元素以及angular.element()用法
Jul 25 #Javascript
以BootStrap Tab为例写一个前端组件
Jul 25 #Javascript
基于Bootstrap的标签页组件及bootstrap-tab使用说明
Jul 25 #Javascript
js事件委托和事件代理案例分享
Jul 25 #Javascript
基于JavaScript实现多级菜单效果
Jul 25 #Javascript
简单谈谈React中的路由系统
Jul 25 #Javascript
You might like
PHP与javascript对多项选择的处理
2006/10/09 PHP
关于文本留言本的分页代码
2006/10/09 PHP
PHP mysqli_free_result()与mysqli_fetch_array()函数详解
2016/09/21 PHP
php观察者模式应用场景实例详解
2017/02/03 PHP
php检测mysql表是否存在的方法小结
2017/07/20 PHP
PHP基于pdo的数据库操作类【可支持mysql、sqlserver及oracle】
2018/05/21 PHP
jQuery.Validate 使用笔记(jQuery Validation范例 )
2010/06/25 Javascript
jquery实现不同大小浏览器使用不同的css样式表的方法
2014/04/02 Javascript
仿百度联盟对联广告实现代码
2014/08/30 Javascript
jQuery中:checkbox选择器用法实例
2015/01/03 Javascript
js 获取元素在页面上的偏移量的方法汇总
2015/04/13 Javascript
jQuery实现的漂亮表单效果代码
2015/08/18 Javascript
WebPack基础知识详解
2017/01/16 Javascript
详解如何构建Promise队列实现异步函数顺序执行
2018/10/23 Javascript
[00:52]DOTA2齐天大圣预告片
2016/08/13 DOTA
Python实现的排列组合计算操作示例
2017/10/13 Python
python:print格式化输出到文件的实例
2018/05/14 Python
python异步实现定时任务和周期任务的方法
2019/06/29 Python
python 经典数字滤波实例
2019/12/16 Python
Python实现银行账户资金交易管理系统
2020/01/03 Python
如何在keras中添加自己的优化器(如adam等)
2020/06/19 Python
美国专营婴幼儿用品的购物网站:buybuy BABY
2017/01/01 全球购物
不开辟用于交换数据的临时空间,如何完成字符串的逆序
2012/12/02 面试题
出纳员的岗位职责
2014/02/22 职场文书
小学班主任寄语大全
2014/04/04 职场文书
交通志愿者活动总结
2014/06/27 职场文书
运动会400米加油稿(8篇)
2014/09/22 职场文书
党员贯彻十八大精神思想汇报范文
2014/10/25 职场文书
平安家庭事迹材料
2014/12/20 职场文书
关于学习的决心书
2015/02/05 职场文书
求职自荐信怎么写
2015/03/04 职场文书
贫困生证明范文
2015/06/16 职场文书
小学语文教学反思范文
2016/03/03 职场文书
阿里云 Windows server 2019 配置FTP
2022/04/28 Servers
浅谈音视频 pts dts基本概念及理解
2022/08/05 数码科技
Python 第三方库 openpyxl 的安装过程
2022/12/24 Python