下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
【移动应用开发技术】微信公众号开发纪要(4)-调用微信扫一扫功能
在微信公众号页面中调用微信扫一扫功能,就是调用微信JS-SDK。让JS-SDK完成调用摄像头扫描,然后我们将扫描结果进行业务操作。微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力,为微信用户提供更优质的网页体验。如何调用微信JS-SDK,在微信公众平台技术文档中的微信网页开发——》微信JS-SDK说明文档中有详细说明。调用微信JS-SDK需要五个步骤。步骤一:绑定域名步骤二:引入JS文件步骤三:通过config接口注入权限验证配置步骤四:通过ready接口处理成功验证步骤五:通过error接口处理失败验证1、绑定域名先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。备注:登录后可在“开发者中心”查看对应的接口权限。点击提交后,会弹出配置成功的提示。这里特别提醒注意:填写域名时,不要带http://。
只要你带了,步骤三的权限验证肯定报错。会报URL配置的错误。2、引入JS文件在需要调用JS接口的页面引入如下JS文件,(支持https):/open/js/jweixin-1.2.0.js备注:支持使用AMD/CMD标准模块加载方法加载3、通过config接口注入权限验证配置所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web
app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web
app的页面会导致签名失败,此问题会在Android6.2中修复)。wx.config({
debug:true,//
开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId:'',//必填,公众号的唯一标识
timestamp:,//必填,生成签名的时间戳
nonceStr:
'',//必填,生成签名的随机串
signature:'',//必填,签名
jsApiList:[]//
必填,需要使用的JS接口列表});这个配置信息可以写在一个ajax内,在进入页面时首先执行,在后台将对应的信息全部获取,再返回给前端。前端页面代码:$.ajax({
type:"post",
url:"这里写你自己的请求地址”,
data:{},
success:function(data){
varresult=$.parseJSON(data);
wx.config({
debug:true,
appId:
result.appId,
//公众号的唯一标识
timestamp:
""+result.timestamp,
//生成签名的时间戳
nonceStr:result.noncestr,
//生成签名的随机串
signature:result.signature,
//签名
jsApiList:[
'scanQRCode']
//需要使用的JS接口列表(我只需要调用扫一扫的接口,如有多个接口用逗号分隔)
});
}});
后端代码就是生成签名。如何生成签名,微信公众号已经给出了官方例子。照着官方例子打一遍代码就行了。下载地址:/jssdk/sample.zip。这里特别强调的事情:生成签名的url一定是你调用JSSDK的页面url,不能是以前的URL。因为我后端是用springmvc实现的,写的时候没有重定向。虽然页面到了调用页面但URL还是原来的,所以总是报签名错误。测了很多次,才改过来。4、通过ready接口处理成功验证wx.ready(function(){
//config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,
//config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,
//
则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,
//则可以直接调用,不需要放在ready函数中。});
因为我是加载页面就调用微信扫一扫,所以将相关接口就放在了ready函数中。
wx.ready(function(){
document.querySelector('#scan').onclick=
function(){
wx.scanQRCode({
needResult:1,
//默认为0,扫描结果由微信处理,1则直接返回扫描结果,
scanType:["qrCode","barCode"],
//可以指定扫二维码还是一维码,默认二者都有
success:function(res){
//res.resultStr可以获得扫描结果。这里写自己的业务操作代码}
});
}
});
//res.resultStr可以获得扫描结果。这里写自己的业务操作代码}
});
}
});5、通过error接口处理失败验证wx.error(function(res){
//config信息验证失败会执行error函数,如签名过期导致验证失败,
//具体错误信息可以打开config的debug模式查看,
//也可以在返回的res参数中查看,对于SPA可以在这里更新签名。});wx.error(f
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 促销活动广告语
- 企业开展“强素质树形象”活动情况小结
- 中秋节日的慰问信(17篇)
- 中学秋季开学典礼活动主持词范文(8篇)
- 中秋佳节的活动主持词范文(5篇)
- DB12-T 1071-2021 氟骨症现症病人随访管理规范
- 影响粉末静电喷涂质量的诸多因素
- 耐火材料 高温耐压强度试验方法 征求意见稿
- 戈雅课件教学课件
- 八年级上学期语文第二次月考考试卷
- 电力电缆线路 电缆排管敷设(建筑电气施工)
- 综合实践活动课《早餐与健康》优质课件
- 爆破安全工作总结
- 物业保安、保洁项目投标书
- 眼视光学:专业职业生涯规划
- 预防母婴传播培训
- 房屋改造方案可行性分析报告
- 2024年电子维修培训资料
- 水利工程测量的内容和任务
- 项目风险识别与控制-年度总结
- 《决策心理学》课件
评论
0/150
提交评论