微信JS-SDK「分享信息設置」API及數字簽名生成方法（NodeJS版本）

時間 2019-12-20

標籤微信 sdk 分享信息設置 api 數字簽名生成方法 nodejs 版本欄目 JavaScript 简体版

原文原文鏈接

原文: 微信JS-SDK「分享信息設置」API及數字簽名生成方法（NodeJS版本）

先上測試地址以示成功：html

用微信打開下面地址測試git

http://game.4gshu.com/deep-love/index.htmlgithub

獲直接掃二維碼君web

用異步ajax的方式獲取數字簽名

異步的方式好ajax

一、先後端分離啊後端

二、一個服務能夠供多個微信公衆賬號的數字簽名服務api

在服務器端用NodeJS跑起一個數字簽名生成服務，web端用ajax方式請求NodeJS服務獲取數字簽名信息緩存

獲得信息後配置微信JS-SDK安全

步驟

第一步認證的微信公衆賬號

首先你得擁有一個經過認證了的微信公衆號或者開發者賬號，沒有經過認證的公衆賬號。數字簽名認證也能成功，可是分享信息是沒法設置成功的；

第二步添加安全域名

在公衆賬號平臺後臺添加app運行的域名地址，能夠理解爲爲某個域名添加白名單功能

以咱們公司旗下的榕樹下爲例：

微信公衆號是：榕樹下，添加了game.4gshu.com爲安全域名，那麼我在game.4gshu.com上的網頁可使用榕樹下公衆賬號的數字簽名了

第三步生成數字簽名

在微信公衆平臺後臺上面能找到一個 appid 及 secret字符串

經過這兩個數據，請求微信提供的兩個公開API地址，生成對應的access_token後再生成ticket再經過規則加密成數字簽名

注意，數字簽名必須在服務端生成，這裏我以NodeJS來實現

數字簽名具體生成過程，NodeJS版本

一、獲取微信簽名所需的access_token

https.get('https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid寫在這裏&secret=你的secret寫在這裏', function(_res) {
               // 這個異步回調裏能夠獲取access_token
          })

二、獲取微信簽名所需的ticket服務器

https.get('https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=上一步中獲取的access_token&type=jsapi', function(_res){
         // 這個異步回調裏能夠獲取ticket
});

三、生成數字簽名具體方法

ticket、 noncestr、timestamp、url經過微信的規則用sha1加密

noncestr和timestamp在微信官方sample包中有具體的生成方法函數

 // noncestr
     var createNonceStr = function() {
          return Math.random().toString(36).substr(2, 15);
     };

      // timestamp
     var createTimeStamp = function () {
          return parseInt(new Date().getTime() / 1000) + '';
     };

也能夠參考我代碼中的代碼

 // 計算簽名方法
     var calcSignature = function (ticket, noncestr, ts, url) {
          var str = 'jsapi_ticket=' + ticket + '&noncestr=' + noncestr + '&timestamp='+ ts +'&url=' + url;
          shaObj = new jsSHA(str, 'TEXT');
          return shaObj.getHash('SHA-1', 'HEX');
     }
var signature = calcSignature(ticket, noncestr, timestamp, url);

四、返回輸出signature數字簽名以及在生成數字簽名時用到的timestamp、nonceStr、url、及appid

由於在客戶內初始化微信JS-SDK中還要用到

五、至此數字簽名生成成功

第四步在web中如何使用數字簽名？

一、引入微信JS-SDK

http://res.wx.qq.com/open/js/jweixin-1.0.0.js

二、請求服務器獲取數字簽名

在web上用ajax方式請求NodeJS服務地址，請求時將當前web地址url上傳至服務器

服務器生成數字簽名後返回：

signature，timestamp, appid, nonceStr

這四個數據用於配置微信JS-SDK

wx.config({
                  debug: true,
                  appId: appid,
                  timestamp: timestamp,
                  nonceStr: nonceStr,
                  signature: signature,
                  jsApiList: [
                      'checkJsApi',
                      'onMenuShareTimeline',
                      'onMenuShareAppMessage',
                      'onMenuShareQQ',
                      'onMenuShareWeibo',
                      'hideMenuItems',
                      'chooseImage'
                  ]
              });

三、在wx.ready內調用API

wx.ready(function(){
                   var sdata = {
                        title: '那年|時光遺忘了，文字卻清晰地復刻着',
                        desc: '那年|時光遺忘了，文字卻清晰地復刻着',
                        link: 'http://game.4gshu.com/deep-love/index2.html',
                        imgUrl: 'http://game.4gshu.com/xuangedan/other-project/2015-01-06/img/share-wx-logo.jpg',
                        success: function () {
                            alert('用戶確認分享後執行的回調函數');
                        },
                        cancel: function () {
                            alert('用戶取消分享後執行的回調函數');
                        }
                    };
                   wx.onMenuShareTimeline(sdata);
                   wx.onMenuShareAppMessage(sdata);
              });

四、搞定

關於數字簽名過時與微信API的1w次請求的限制問題

因爲微信提供的兩個數字簽名生成API有7200秒的有效期，而且暫時有1w次的限制，因此在咱們本身服務器上須要將數字簽名緩存

邏輯是：

若是用戶請求時沒緩存中沒有數字簽名，那麼請求執行 第三步生成數字簽名

若是緩存中有，而且是在2小時內那麼直接返回數字簽名信息，不去請求微信服務器

若是緩存中的數字簽名過時了(超過2小時)則仍是執行 第三步生成數字簽名

注意：因爲微信規定地址欄中的參數發生變化都認做是新的請求地址，數字簽名也須要從新生成。

新生成的數字簽名將存入cachedSignatures對象內

緩存中的數據結構將url設爲key

數據結構以下：

var cachedSignatures =  {
               'http://game.4gshu.com/': {
                    appid: ’微信認證賬號的的appid'
                    ,secret: '微信認證賬號的secret'
                    ,timestamp: '1421135250'
                    ,noncestr: 'ihj9ezfxf26jq0k'
               }
          }