欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

解析微信JS-SDK配置授權(quán),實(shí)現(xiàn)分享接口

 更新時(shí)間:2016年12月09日 11:06:13   作者:liliangel  
這篇文章是微信開發(fā)的很多前置條件,包括了服務(wù)端基于JAVA的獲取和緩存全局的access_token,獲取和緩存全局的jsapi_ticket,以及前端配置授權(quán)組件封裝,調(diào)用分享組件封裝。需要的朋友可以看下

微信開放的JS-SDK面向網(wǎng)頁(yè)開發(fā)者提供了基于微信內(nèi)的網(wǎng)頁(yè)開發(fā)工具包,最直接的好處就是我們可以使用微信分享、掃一掃、卡券、支付等微信特有的能力。7月份的時(shí)候,因?yàn)檫@個(gè)分享的證書獲取問(wèn)題深深的栽了一坑,后面看到“config:ok”的時(shí)候真的算是石頭落地,瞬間感覺(jué)世界很美好..

這篇文章是微信開發(fā)的很多前置條件,包括了服務(wù)端基于JAVA的獲取和緩存全局的access_token,獲取和緩存全局的jsapi_ticket,以及前端配置授權(quán)組件封裝,調(diào)用分享組件封裝。

配置授權(quán)思路:首先根據(jù)access_token獲取jsapi_ticket,在通過(guò)獲取到的jsapi_ticket以及隨機(jī)生成的字符串、時(shí)間戳,再加上需要授權(quán)的頁(yè)面地址url,進(jìn)行SHA-1加密,返回加密字符串,最后根據(jù)加密串調(diào)用微信提供的config接口。

配置JS接口安全域名

公眾平臺(tái)--公眾號(hào)設(shè)置--功能設(shè)置--js接口安全域名

獲取、緩存全局的access_token

  /**
  * 微信全局票據(jù) ---->>>> access_token
  * @return
  * @throws ClientProtocolException
  * @throws IOException
  */
 public String getBaseAccessToken() throws ClientProtocolException, IOException{ 
  try {
   String value = redisService.get("WEIXIN_BASE_ACCESS_TOKEN");
   if (!StringUtils.isEmpty(value)) {
    LOGGER.info("Get base access_token from redis is successful.value:{}",value);
    return value;
   }else{
    synchronized (this) {
     //緩存中沒(méi)有、或已經(jīng)失效
     String url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid="+WX_APPID+"&secret="+ WX_APPSECRET;
     String rs = apiService.doGet(url);
     
     JSONObject obj_content = JSONObject.parseObject(rs);
     String accessToken = obj_content.getString("access_token");
     Integer time = Integer.parseInt(obj_content.getString("expires_in").toString());
     
     //寫緩存
     redisService.set("WEIXIN_BASE_ACCESS_TOKEN", accessToken, time - 3600);
     LOGGER.info("Set base access_token to redis is successful.parameters time:{},realtime",time,time-3600);
     return accessToken;
    }
   }
  } catch (Exception e) {
   LOGGER.error("Get base access_token from redis is error.");
  }
  return null;
 }

先從緩存中取key為“WX_BASE_ACCESS_TOKEN” ,如果命中直接返回值,反之通過(guò)httpclient發(fā)送GET請(qǐng)求調(diào)用微信提供的接口獲取全局的access_token,同時(shí)將取到的值寫入緩存。

獲取、緩存全局的jsapi_ticket

  /**
  * jsapi_ticket是公眾號(hào)用于調(diào)用微信JS接口的臨時(shí)票據(jù)
  * @return
  * @throws IOException 
  * @throws ClientProtocolException 
  */
 public String getJsapiTicket() throws ClientProtocolException, IOException{
  try {
   String value = redisService.get("WEIXIN_JS_API_TICKET");
   if (!StringUtils.isEmpty(value)) {
    return value;
   }else{
    synchronized (this) {
     //緩存中沒(méi)有、或已經(jīng)失效
     //獲取全局的access_token,唯一票據(jù)
     String accessToken = getBaseAccessToken();
     String url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token="+ accessToken +"&type=jsapi";
     String rs = apiService.doGet(url);
     JSONObject obj_content = JSONObject.parseObject(rs);
     String jsapi_ticket = obj_content.getString("ticket");
     Integer time = Integer.parseInt(obj_content.getString("expires_in").toString());
     //寫緩存
     redisService.set("WEIXIN_JS_API_TICKET", jsapi_ticket, time - 3600);
     return jsapi_ticket;
    }
   }
  } catch (Exception e) {
   LOGGER.error("Get js_api_ticket from redis is error:{}",e);
  }
  return null;
 }

由于獲取jsapi_ticket微信有100000次限制,所以必須用上緩存。同理獲取access_token,我這里為了保險(xiǎn)起見(jiàn)緩存失效時(shí)間設(shè)置為官方提供的時(shí)間再減去一個(gè)小時(shí)。

jssdk加密串獲取restful

1.Controller

  /**
  * 微信分享證書獲取
  * @param 
  * @return signature
  * @throws IOException 
  */
 @RequestMapping(value = "/signature", method = RequestMethod.GET)
 public @ResponseBody String createSignature(
        @RequestParam String url) throws IOException{
  LOGGER.info("RestFul of createSignature parameters url:{}",url);
  try {
   String rs = wechatService.createSignature(url);
   LOGGER.info("RestFul of signature is successful.",rs);
   return rs;
  } catch (Exception e) {
   LOGGER.error("RestFul of signature is error.",e);
  }
  return null;
 }

2.Service

 /**
  * 根據(jù)jsapi_ticket等參數(shù)進(jìn)行SHA1加密
  * @param nonceStr 隨機(jī)字符串
  * @param timestamp 當(dāng)前時(shí)間戳
  * @param url 當(dāng)前頁(yè)面url
  */
 public String createSignature(String url) throws ClientProtocolException, IOException{
  String nonceStr = create_nonce_str();
  String timestamp = create_timestamp();
  
  String signature = "jsapi_ticket="+getJsapiTicket();
    signature += "&noncestr="+nonceStr;
    signature += "&timestamp="+timestamp;
    signature += "&url="+url;
  try {
   MessageDigest crypt = MessageDigest.getInstance("SHA-1");
   crypt.reset();
   crypt.update(signature.getBytes("UTF-8"));
   signature = byteToHex(crypt.digest());
  } catch (Exception e) {
   LOGGER.error("Signature for SHA-1 is error:{}",e);
  }
  Map<String, String> map = new HashMap<String, String>();
  map.put("timestamp", timestamp);
  map.put("nonceStr", nonceStr);
  map.put("signature", signature);
  map.put("appid", WX_APPID);
  return JSON.toJSONString(map, true);
 }
 private static String byteToHex(final byte[] hash) {
  Formatter formatter = new Formatter();
  for (byte b : hash) {
   formatter.format("%02x", b);
  }
  String result = formatter.toString();
  formatter.close();
  return result;
 }

WX_APPID為公眾號(hào)appid,通過(guò)spring@value注解從配置文件獲取,這里不細(xì)說(shuō)。

3.生成隨機(jī)字符串

private static String create_nonce_str() {
  return UUID.randomUUID().toString();
 }

4.時(shí)間格式化

private static String create_timestamp() {
  return Long.toString(System.currentTimeMillis() / 1000);
 }

到此為止后臺(tái)全部完成,其實(shí)沒(méi)有太多的解釋,仔細(xì)讀一遍代碼,可讀性應(yīng)該還行!

封裝獲取授權(quán)組件,實(shí)現(xiàn)分享方法

require.config({
 urlArgs: "v=20161116" ,
 baseUrl : "/static",
 paths: {
  jweixin: 'component/jweixin/jweixin-1.0.0',
  share: 'component/wechat/share'//微信分享組件
 }
})

首先通過(guò)調(diào)用后臺(tái)接口獲取加密字符串,調(diào)用微信提供的wx.config()方法

//jsSDK授權(quán)
 $.signature = function(wx,opts,currentUrl,callback){
  $.ajax({
   data: {url: currentUrl},
   type: "GET",
   url: WX_ROOT + "wechat/signature",
   success: function (json) {
    if (json) {
     var data = JSON.parse(json); 
     wx.config({
      debug: false,
      appId: data.appid,
      timestamp: data.timestamp,
      nonceStr: data.nonceStr,
      signature: data.signature,
      jsApiList: [
       'onMenuShareTimeline',
       'onMenuShareAppMessage',
       'onMenuShareQQ',
       'onMenuShareWeibo',
       'onMenuShareQZone'
      ]
     });
     wechatShare.options.isSignature = true;
     callback && callback(opts,wx);
    }
   }
  });
 }

建議:開發(fā)環(huán)境建議開啟調(diào)式模式,方便打印日志定位問(wèn)題debug: true  

所有接口調(diào)用都必須在config接口獲得結(jié)果之后,config是一個(gè)客戶端的異步操作,我這里用一個(gè)全局變量isSignature緩存了是否已經(jīng)配置授權(quán),然后執(zhí)行回調(diào)。如實(shí)現(xiàn)分享接口:

//分享
 $.share = function(opts,wx) {
  var options = {
    currentUrl: window.location.href.split('#')[0],
    imgUrl: null,
    title: '達(dá)農(nóng)保險(xiǎn)',
    desc: null,
    shareUrl: null
   }
  $.extend(true, options, opts || {});
  //判斷是否已經(jīng)授權(quán)
  if(!wechatShare.options.isSignature){
   $.signature(wx,opts,options.currentUrl,$.share)
  }else{
   wx.ready(function(){
    //分享到朋友圈
    wx.onMenuShareTimeline({
     title: options.title,
     link: options.shareUrl,
     imgUrl: options.imgUrl,
     success: function () {
      //分享統(tǒng)計(jì),分享來(lái)源 1 朋友圈 2分享給朋友 3分享到QQ 4分享到QQ空間 
     }
    });
    //分享給朋友
    wx.onMenuShareAppMessage({
     title: options.title,
     desc: options.desc,
     link: options.shareUrl,
     imgUrl: options.imgUrl
    });
   });
  } 
 }

我先確認(rèn)是否已經(jīng)配置授權(quán),如果沒(méi)有授權(quán)則調(diào)用$.signature()回調(diào)函數(shù)里傳入$.share,有點(diǎn)類似遞歸調(diào)用,當(dāng)再次回到share方法的時(shí)候isSignature已經(jīng)是true了,則執(zhí)行wx.ready()方法,再調(diào)需要調(diào)用的接口,微信開放提供了很多接口給我們,分享只是其中一個(gè)。只有想不到的,沒(méi)有實(shí)現(xiàn)不了的....

注意:currentUrl 必須是動(dòng)態(tài)獲取的,通過(guò)window.location.href方法,因?yàn)轫?yè)面分享,微信客戶端會(huì)在你的鏈接末尾加入其它參數(shù),所以需要再將url用‘#'割一下,取第一個(gè),如果有中文最好是用encodeURIComponent轉(zhuǎn)義一下,保證簽名獲取成功。如果報(bào)invalid signature,大部分原因是傳入的url,和加密算法的問(wèn)題,仔細(xì)檢查!

調(diào)用:

var ua = navigator.userAgent.toLowerCase(),
 isWechat = ua.indexOf('micromessenger') != -1;//判斷是否為微信瀏覽器
var shareData = {
    title: ‘測(cè)試分享',
    desc: ‘這里是描述,分享到朋友圈不會(huì)顯示',
    link: APP_ROOT + '/base/downloadApp,//分享后打開的鏈接,必須在配置的安全域名下
    imgUrl: PIC_PATH + (self.data.shareListData[0].imgSmall || '/static/img/coupon/getTicPic.png'),//分享后顯示的圖片
    success: function(){
      setTimeout(function(){
              //運(yùn)營(yíng)數(shù)據(jù)統(tǒng)計(jì)
             },0)//偽異步方式調(diào)用
     }
        }
//微信瀏覽器分享加載
if(isWechat){
 require(['jweixin'],function(wx){
    require(['share'],function(){
   $.share(shareData,wx);
    })
  })
}

完整js:https://github.com/helijun/component/blob/master/wechat/share.js

常用問(wèn)題總結(jié):

最開始做這個(gè)分享功能的時(shí)候,因?yàn)橐粋€(gè)證書獲取失敗的原因(invalid signature)真的是斷斷續(xù)續(xù)困了好幾天,有的時(shí)候真的是毫無(wú)頭緒了。反復(fù)檢查代碼,逐字逐行的看,真的沒(méi)有發(fā)現(xiàn)任何異常,通過(guò)微信提供的一個(gè)js接口簽名校驗(yàn)工具測(cè)試也是返回ture,然而就是報(bào)證書失??!微信官方文檔又有點(diǎn)模棱兩可,到最后星期六的一個(gè)下午,靜下心來(lái),再耐心的檢查了一遍后臺(tái)SHA1加密算法,終于看到config true..  曙光

開發(fā)中我們總是會(huì)遇到各種各樣的問(wèn)題,程序員和bug永遠(yuǎn)都是好朋友同時(shí)又是敵人,我們總是徘徊在bug的邊緣,有時(shí)候當(dāng)遇到很奇怪的問(wèn)題的時(shí)候不妨先放一下,注意力先轉(zhuǎn)移一下,去陽(yáng)臺(tái)吹吹風(fēng),說(shuō)不定在某一個(gè)時(shí)刻,問(wèn)題突然就解開了..

接口簽名校驗(yàn)工具

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

以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,同時(shí)也希望多多支持腳本之家!

相關(guān)文章

最新評(píng)論