JSSDK使用步骤:

步骤一:绑定域名

步骤二:引入JS文件

步骤三:通过config接口注入权限验证配置

步骤四:通过ready接口处理成功验证

步骤五:通过error接口处理失败验证

具体步骤方法说明给查看官方给出的微信开发者文档

https://mp.weixin.qq.com/wiki/11/74ad127cc054f6b80759c40f77ec03db.html

所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用

wx.config({

    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。

    appId: '', // 必填,公众号的唯一标识

    timestamp: , // 必填,生成签名的时间戳

    nonceStr: '', // 必填,生成签名的随机串

    signature: '',// 必填,签名

    jsApiList: [] // 必填,需要使用的JS接口列表

});

其中要保证能正常使用接口的一个重要条件就是获取签名,那么签名是什么,有什么用,怎么获取签名就是今天我今天要讲的重点了。

签名,在我们日常生活中经常用到,在一些核实、审查信息,结案等时候需要某个人的亲笔签名,在网站开发中也一样,签名是否正确是能否调用微信接口的重要条件,可以理解为就是票据。

签名生成规则如下:参与签名的字段包括noncestr(随机字符串), 有效的jsapi_ticket, timestamp(时间戳), url(当前网页的URL,不包含#及其后面部分) 。对所有待签名参数按照字段名的ASCII 码从小到大排序(字典序)后,使用URL键值对的格式(即key1=value1&key2=value2…)拼接成字符串string1。这里需要注意的是所有参数名均为小写字符。对string1作sha1加密,字段名和字段值都采用原始值,不进行URL 转义。

即signature=sha1(string1)。 示例:

  • noncestr=Wm3WZYTPz0wzccnW
  • jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg
  • timestamp=1414587457
  • url=http://mp.weixin.qq.com?params=value

步骤1. 对所有待签名参数按照字段名的ASCII 码从小到大排序(字典序)后,使用URL键值对的格式(即key1=value1&key2=value2…)拼接成字符串string1:

jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW&timestamp=1414587457&url=http://mp.weixin.qq.com?params=value

对string1进行sha1签名,得到signature:

0f9de62fce790f9a083d5c99e95740ceb90c27ed
好了 我们已经看到了 获得签名需要4个参数,其中timestamp时间戳和url页面完整url都很容易获得,现在就需要获得noncestr随机字符串和jsapi_ticket。
生成签名之前必须先了解一下jsapi_ticket,jsapi_ticket是公众号用于调用微信JS接口的临时票据。正常情况下,jsapi_ticket的有效期为7200秒,通过access_token来获取.
好了说了这么多 我们直接来看一段代码实例:
class jsControl{
//$store_id是店铺id用来去数据库中查询这个店铺当前的微信公众号信息,appid,appsecret等信息
/**
*@param int $store_id 店铺id用于到数据库中获取店铺微信公众号的配置信息
*@return 返回config接口注入权限验证配置信息
**/
public function getJsConfigInfo($store_id = 0){
if(!$this->checkIsInWeixin()){
return [];
}
if(!$store_id){
$store_id = intval($_SESSION['store_member_info_ID'] ?: ($_SESSION['route_store_id'] ?: ($_GET['store_id'] ?: $_SESSION['store_id'])));
}
if(empty($store_id)){
return [];
}
$store_info = Model()->table('store_wxinfo')->where(['store_id' => $store_id])->find();//查询店铺公众号配置信息
if(empty($store_info)){
return [];
}
$tickets = $this->get_jsapi_ticket($store_info['store_id'], $store_info['appid'], $store_info['appsecret']);
if(empty($tickets)){
return [];
}
$nonceStr = $this->getNonceStr();
$timestamp = TIMESTAMP;
$url = $this->getSelfLink();
$string1 = "jsapi_ticket={$tickets}&noncestr={$nonceStr}&timestamp={$timestamp}&url={$url}";
$signature = sha1($string1);
return [
'debug' => false,
'appId' => $store_info['appid'],
'timestamp' => $timestamp,
'nonceStr' => $nonceStr,
'signature' => $signature,
'jsApiList' => ['onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ','onMenuShareWeibo','onMenuShareQZone','startRecord','stopRecord','onVoiceRecordEnd','playVoice','pauseVoice','stopVoice','onVoicePlayEnd','uploadVoice','downloadVoice','chooseImage','previewImage','uploadImage','downloadImage','translateVoice','getNetworkType','openLocation','getLocation','hideOptionMenu','showOptionMenu','hideMenuItems','showMenuItems','hideAllNonBaseMenuItem','showAllNonBaseMenuItem','closeWindow','scanQRCode','chooseWXPay','openProductSpecificView','addCard','chooseCard','openCard']
];
} public function getSelfLink(){
$protocol = strpos(strtolower($_SERVER['SERVER_PROTOCOL']), 'https') !== false ? 'https://' : 'http://';
$host = $protocol . $_SERVER['HTTP_HOST'];
$url = $host . $_SERVER['REQUEST_URI'];
return $url;
}
public function getNonceStr(){
$chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
$str = '';
for ($i = 0; $i < 16; $i++) {
$str .= $chars{mt_rand(0, strlen($chars) - 1)};
}
return $str;
}
public function _get_access_token($store_id,$appid,$appsecret){
$token = rkcache("access_token_$store_id");
if(!empty($token)){
$token = unserialize($token);
}else{
$token = array();
}
if(empty($token) || time()-$token['create_time'] > 7200){
$uri = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='.$appid.'&secret='.$appsecret;
$token = curl($uri);
$token = json_decode($token,true);
if(!isset($token['access_token']) || empty($token['access_token'])){
return '';
}
$token['create_time']=time();
wkcache("access_token_$store_id",serialize($token));
}
return $token['access_token'];
}
function get_jsapi_ticket($store_id,$appid,$appsecret) {
$tickets = rkcache("jsapi_ticket_$store_id");
if ($tickets) {
$tickets = unserialize($tickets);
}
if (empty($tickets) || time() - $tickets['create_time'] >= 7200) {
$access_token = $this->_get_access_token($store_id,$appid,$appsecret);
if ('' == $access_token) {
return '';
}
$uri = 'https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=' . $access_token . '&type=jsapi';
$tickets = curl($uri);
$tickets = json_decode($tickets, true);
if (empty($tickets['ticket'])) {
return '';
}
$tickets['create_time'] = time();
wkcache("jsapi_ticket_$store_id", serialize($tickets));
}
return $tickets['ticket'];
} protected function checkIsInWeixin() {
if (strpos($_SERVER['HTTP_USER_AGENT'], 'MicroMessenger') !== false) {
return true;
}
return false;
} }

给出一个前端js调用的方法:

<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="javascript/text" > var wx_data = <?php echo json_encode($output['jsapi_config']); ?>;
var member_info = <?php echo json_encode($output['member_info']);?>;
var goods_img = $("#goods_img").find("img").attr("src");
wx.config(wx_data);
if($.isEmptyObject(wx_data.appId)){
alert('请在微信中打开分享');
}
var sharedata = {
title : "<?php echo $output['goods_info'][0]['goods_name'];?>",
desc :'你的朋友:' + member_info.member_name + ' 给你分享了好商品,快来看看吧',
imgUrl : goods_img,
link :"<?php echo $output['link_url']; ?>",
success: function(){
},
cancel: function(){
}
};
wx.ready(function () {
wx.onMenuShareAppMessage(sharedata);
wx.onMenuShareTimeline(sharedata);
});
</script>

总结一下:

通过config接口注入权限验证配置:

var config_info = {};

config_info对象中需要的属性有5个 :
1获取qppid,2获取生成签名的时间戳(timestamp),3获取生成签名的随机字符串(noncestr),4获取签名(signature),5调动的接口列表。

其中获取签名需要4个参数:1随机字符串noncestr,2时间戳(timestamp),3调用票据jsapi_ticket,4当前页面完整url

其中获取调用票据jsapi_ticket需要一个携带access_token的请求获取:https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi

所以完整的流程就是:库中查询appid,appsecret,然后获取access_token,通过access_token获取票据jsapi_ticket,得到票据jsapi_ticket后生成签名,然后完成全线验证配置

原创作品,转载请注明出处!

php 微信JS-SDK封装类的更多相关文章

  1. 实战微信JS SDK开发:贺卡制作与播放(1)

    前段时间忙于CanTK 2.0的开发,所以博客一直没有更新.CanTK 2.0主要增强了游戏和富媒体的开发,现在编码和测试基本完成了,等文档完成了再正式发布,里面有不少激动人心的功能,等发布时再一一细 ...

  2. 微信JS SDK接入的几点注意事项

    微信JS SDK接入,主要可以先参考官网说明文档,总结起来有几个步骤: 1.绑定域名:先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”.备注:登录后可在“开发者中心”查看对 ...

  3. 微信js sdk上传多张图片

    微信js sdk上传多张图片,微信上传多张图片 该案例已tp3.2商城为例 直接上代码: php代码: public function ind(){ $appid="111111111111 ...

  4. 调用微信js sdk

    场景:需要调用微信获取当前位置的借口. 途径:查看微信 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 .后 ...

  5. 微信JS SDK配置授权,实现分享接口

    微信开放的JS-SDK面向网页开发者提供了基于微信内的网页开发工具包,最直接的好处就是我们可以使用微信分享.扫一扫.卡券.支付等微信特有的能力.7月份的时候,因为这个分享的证书获取问题深深的栽了一坑, ...

  6. 微信js SDK接口

    微信JS-SDK说明文档 http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html 一.微信登录功能 在进行微信OAut ...

  7. 微信JS SDK使用权限签名算法

    jsapi_ticket 生成签名之前必须先了解一下jsapi_ticket,jsapi_ticket是公众号用于调用微信JS接口的临时票据.正常情况下,jsapi_ticket的有效期为7200秒, ...

  8. 微信js sdk分享开发摘记java版

    绑定域名和引入js的就不说了 废话不说直接上代码 public void share(HttpServletRequest request) throws Exception { StringBuff ...

  9. 微信js sdk动态引用

    一般情况下,微信的js-sdk只需要直接引用script即可 <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js&qu ...

  10. 微信JS SDK Demo 官方案例[转]

    摘要: 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包. 通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用 ...

随机推荐

  1. python字典(dictionary)使用:基本函数code实例,字典的合并、排序、copy,函数中*args 和**kwargs做形参和实参

    python字典dictionary几个不常用函数例子 一.字典声明 如,d={}; d= {'x':1,'b':2} d1 = dict(x=1,y=2,z=3)     d2 = dict(a=3 ...

  2. 一键安装gitlab7在rehl6.4上

    一键安装gitlab7在rehl6.4上 参考原文: http://blog.csdn.net/ubuntu64fan/article/details/38367579 1 关于gitlab7 无论如 ...

  3. H5学习之旅-H5的元素属性(3)

    1.标签可以拥有属性,为标签提供更多的信息 2.属性以键值对的形式呈现例如:href = "www.baidu.com" 3.常用标签属性 :align对其方式 ,对齐方式,包括上 ...

  4. 浅谈我为什么选择用Retrofit作为我的网络请求框架

    比较AsyncTask.Volley.Retrofit三者的请求时间 使用 单次请求 7个请求 25个请求 AsyncTask 941ms 4539ms 13957ms Volley 560ms 22 ...

  5. 安全退出app,activoty栈管理

    前言 由于一个同学问到我如何按照一个流程走好之后回到首页,我以前看到过4个解决方案,后来发现有做个记录和总结的必要,就写了这篇博文.(之前看小强也写过一篇,这里通过自身的分析完整的总结一下以下6种方案 ...

  6. 【翻译】Siesta事件记录器入门

    原文:Getting started with the Siesta event recorder 作者:Mats Bryntse 随着事件记录器功能的发布越来越近,我们准备了一下入门指南,向大家展示 ...

  7. SpriteBuilder修改CCB文件中的子CCB文件需要注意的一个地方

    在SpriteBuilder中如果一个CCB(比如一个场景)中嵌入了另一个子CCB文件(比如一个player),那么当给该子CCB中的root对象添加若干属性的时候,必须注意到这个并没有应用到父CCB ...

  8. Stackoverflow上人气最旺的10个Java问题

    1. 为什么两个(1927年)时间相减得到一个奇怪的结果? (3623个赞) 如果执行下面的程序,程序解析两个间隔1秒的日期字符串并比较: 01 public static void main(Str ...

  9. iOS开发小技巧总结

    一.NSLog的使用 NSLog在调试的时候,屡试不爽,可是在项目中用的太多,其实是会影响程序性能的,而且程序在非调试模式下也看不到打印,多浪费资源呢?如果程序中使用的太多,发布前删除又是一个麻烦事, ...

  10. LeetCode之旅(15)-Odd Even Linked List

    题目描述: Given a singly linked list, group all odd nodes together followed by the even nodes. Please no ...