微信JS-SDK分享

1 引入JS文件http://res.wx.qq.com/open/js/jweixin-1.2.0.js，

2 拿access_token，配置IP白名单才能调此接口，根据appID和appSecret进行请求 (有效期7200秒，每次使用前检查，过期重新获取） 需要存储到redis

获取access_token：

https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='+appID+'&secret='+appSecret;

3 拿jsapi_ticket，根据上一步的access_token进行请求 (有效期7200秒，每次使用前检查，过期重新获取）需要存储到redis

获取jsapi_ticket：

https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=' + access_token + '&type=jsapi';

4计算signature，根据上一步的jsapi_ticket 还有需要用到 jssha npm进行加密

1）排序，参与签名的字段：noncestr（随机字符串），有效的jsapi_ticket，timestamp（时间戳），url（不带#后面部分部分），字典序从小到大排序，

2）拼接，使用URL键值对的格式拼接字符串string1，参数名必须均为小写字符

3）加密，对string1作sha1加密，字段名和字段值都采用原始值，不进行URL 转义注意：计算签名必须在服务端完成签名，返回前端

// 随机字符串
var createNonceStr = function () {
  return Math.random().toString(36).substr(2, 15);
};
 
// 时间戳
var createTimestamp = function () {
  return parseInt(new Date().getTime() / 1000) + '';
};
 
// 排序拼接
var raw = function (args) {
  var keys = Object.keys(args);
  keys = keys.sort();
  var newArgs = {};
  keys.forEach(function (key) {
    newArgs[key.toLowerCase()] = args[key];
  });
  var string = '';
  for (var k in newArgs) {
    string += '&' + k + '=' + newArgs[k];
  }
  string = string.substr(1);
  return string;
};
  
/**
 * @synopsis 签名算法
 *
 * @param jsapi_ticket 用于签名的 jsapi_ticket
 * @param url 用于签名的 url ，注意必须动态获取，不能 hardcode
 *
 * @returns
 */
var sign = function (jsapiTicket, url) {
  var ret = {
    "jsapi_ticket": jsapiTicket,
    nonceStr: createNonceStr(),
    timestamp: createTimestamp(),
    url: url
  };
  var string = raw(ret);
  var shaObj = new jsSHA(string, 'TEXT');
  ret.signature = shaObj.getHash('SHA-1', 'HEX');
  return ret;
};
 
// 计算signature
// 通过调用计算签名方法
var signatureStr = sign(jsapiTicket, ctx.request.body.url);

5 添加JS接口安全域名（在公众号后台的设置/公众号设置/功能设置中添加）

6 验证生成的signature正确性

https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign

7前端调用案例

// 请求签名
  $.ajax({
    url: "/signture",
    type: 'post',
    data: { url: location.href.split('#')[0] },
    success:function(res){
      wx.config({
        debug: false,
        appId: 'xxxxxx',
        timestamp: res.timestamp,
        nonceStr: res.nonceStr,
        signature: res.signature,
        jsApiList: [
          'checkJsApi',
          'onMenuShareTimeline',
          'onMenuShareAppMessage',
          'onMenuShareQQ'
        ]
      });
      wx.ready(function () {
        var shareData = {
          title: document.title,
          desc: getDesc(),
          link: res.url,
          imgUrl: getImage()
        };
        wx.onMenuShareAppMessage(shareData);
        wx.onMenuShareTimeline(shareData);
        wx.onMenuShareQQ(shareData);
      });
      wx.error(function (res) {
        alert(res.errMsg);  // 正式环境记得关闭啊！！！！
      });
    }
  });

常见问题
1 config 错误
如果config fail，一般说明存在配置字段遗漏，或者配置字段的值为空（null，undefined，""）。
2 signature错误
如果报invalid signature错误，一般说明签名没有生成正确，再核对一遍规则。可以使用微信 JS 接口签名校验工具，第6步
3 测试环境怎么测试
只需要在微信公众号后台配置微信测试appID和appSecret 就可以了