配置并学习微信JS-SDK(1)
2015-01-10 22:33
344 查看
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>微信JS-SDK demo http://demo.open.weixin.qq.com/jssdk/#menu-device微信JS-SDK 说明文档:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html配置公众号:微信后台-公众号设置-功能设置-JS接口安全域名引入JS文件:
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>配置js接口接入的配置(根据附录1获取签名):
wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。上线需设置false appId: 'wx693f4c6207512348b33', // 必填,公众号的唯一标识 微信后台-开发者中心 timestamp: , // 必填,生成签名的时间戳 nonceStr: '', // 必填,生成签名的随机串 signature: '',// 必填,签名,见附录1 jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2 });access_token ,需要后台缓存jsapi_ticket,有效期7200秒根据access_token获取jsapi_ticket ,需要后台缓存jsapi_ticket,有效期7200秒根据sha1(jsapi_ticket+url+timestamp+自定义随机串)求出配置中的signature
$this->load->driver( 'cache' ); //获取access_token,jsapi_ticket缓存 $access_token = $this->cache->kvdb->get( 'access_token' ); $jsapi_ticket = $this->cache->kvdb->get( 'jsapi_ticket' ); log_message('error', "获取access_token={$access_token},jsapi_ticket={$access_token}缓存"); //如果不存在access_token缓存 if ( ! $access_token AND ! $jsapi_ticket ) { log_message('error', '如果不存在access_token缓存'); $this->load->library('MyFetchurl'); //1.获取access_token $access_token_json = $this->myfetchurl->https_get( "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=".APPID."&secret=".APPSECRET ); //把 json_decode() 后的对象当作数组使用,需要加第二个参数才是数组返回 $access_token_decode = json_decode( $access_token_json, true ); $access_token = isset( $access_token_decode['access_token'] ) ? $access_token_decode['access_token'] : ''; log_message('error', "获取access_token={$access_token}"); //设置access_token缓存 $result = $this->cache->kvdb->save( 'access_token', $access_token, EXPIRE_TIME ); log_message('error', "设置access_token缓存$result"); //2.获取jsapi_ticket $jsapi_ticket_json = $this->myfetchurl->https_get( "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={$access_token}&type=jsapi" ); $jsapi_ticket_decode = json_decode( $jsapi_ticket_json, true ); $jsapi_ticket = isset( $jsapi_ticket_decode['ticket'] ) ? $jsapi_ticket_decode['ticket'] : ''; log_message('error', "获取jsapi_ticket=$jsapi_ticket"); //设置jsapi_ticket缓存 $result = $this->cache->kvdb->save( 'jsapi_ticket', $jsapi_ticket, EXPIRE_TIME ); log_message('error', "设置jsapi_ticket缓存=$jsapi_ticket");
sae上的curl不支持https,换成SaeFetchurl去获取:封装成方法sae_fetchurl($url, $post_data)json_decode的结果是对象,折腾很久:传人第二个参数true就可以返回数组形式SAE版的CI缓存类数据缓存获取用get() 而不是demo里面的get_metadata(),这个是获取包括缓存时间数据订阅号的可以调用的js接口以及最后配置文件如下
wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: 'wx693f4c620712348b', // 必填,公众号的唯一标识 timestamp: '<?=$timestamp?>', // 必填,生成签名的时间戳 nonceStr: '<?=$noncestr?>', // 必填,生成签名的随机串 signature: '<?=$signature?>',// 必填,签名,见附录1 jsApiList: [// 必填,需要使用的JS接口列表,所有JS接口列表见附录2 'checkJsApi', 'hideMenuItems', 'showMenuItems', 'hideAllNonBaseMenuItem', 'showAllNonBaseMenuItem', 'translateVoice', 'startRecord', 'stopRecord', 'onRecordEnd', 'playVoice', 'pauseVoice', 'stopVoice', 'uploadVoice', 'downloadVoice', 'chooseImage', 'previewImage', 'uploadImage', 'downloadImage', 'getNetworkType', 'openLocation', 'getLocation', 'hideOptionMenu', 'showOptionMenu', 'closeWindow', 'scanQRCode' ] });测试是否验证成功
// 微信在微信浏览器测试,调用结果功能成功!
wx.error(function(res){
console.log('验证失败');
});wx.ready(function(){
document.querySelector('#checkJsApi').onclick = function() {
wx.checkJsApi({
jsApiList:[
'getNetworkType',
'previewImage'
],
success:function(res){
alert(JSON.string)
}
});
}// 6 设备信息接口
// 6.1 获取当前网络状态
document.querySelector('#getNetworkType').onclick = function () {
wx.getNetworkType({
success: function (res) {
alert(res.networkType);
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
};
});
测试demo http://jdhu.sinaapp.com因为漏了copy签名算法上来,补充上 如蓝色部分 谢谢陆先生的提示
相关文章推荐
- 配置并学习微信JS-SDK(2)—扫一扫接口
- 配置并学习微信JS-SDK(2)—图片接口
- 配置并学习微信JS-SDK(3)—菜单接口
- Java微信开发(三)之JS-SDK配置
- 微信JS SDK配置授权,实现分享接口
- 微信JS SDK配置授权,实现分享接口
- 企业微信JS-SDK开发(一)------通过config接口注入权限验证配置
- C#微信网页开发---JSSDK使用 通过config接口注入权限验证配置
- 解析微信JS-SDK配置授权,实现分享接口
- Node.js 配置微信 JS-SDK 权限验证服务
- 微信JS-SDK config OK,但分享配置失败(分享接口回调函数失效)
- C#微信开发-微信JS-SDK(1)之通过config接口注入权限验证配置
- 解析微信JS-SDK配置授权,实现分享接口
- PHP+TP框架生成使用微信JS-SDK所需的配置信息,并验证
- 微信JS_SDK使用和配置
- 微信开发之——JSSDK,通过config接口注入权限验证配置
- Java实现微信JS-SDK【一】配置篇
- ASP.NET WEBAPI实现微信JS-SDK接口注入权限验证配置
- 微信JS-SDK中config接口注入权限验证配置
- 分享一个PHP获取微信JS-SDK配置的操作类