微信js-sdk+JAVA實(shí)現(xiàn)“分享到朋友圈”和“發(fā)送給朋友”功能詳解

更新時(shí)間：2018年03月18日 17:31:07 投稿：wdc

本文分享了微信js-sdk+JAVA實(shí)現(xiàn)“分享到朋友圈”和“發(fā)送給朋友”功能介紹，大家可以參考一下

主要為以下實(shí)現(xiàn)步驟：

1.綁定域名

先登錄微信公眾平臺(tái)進(jìn)入“公眾號(hào)設(shè)置”的“功能設(shè)置”里填寫“JS接口安全域名”。（特別提示不需要加上http或者h(yuǎn)ttps,吃過(guò)虧）

2.頁(yè)面引入js文件

3.通過(guò)config接口注入權(quán)限驗(yàn)證配置

wx.config({

debug: true, // 開啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶端alert出來(lái)，若要查看傳入的參數(shù)，可以在pc端打開，參數(shù)信息會(huì)通過(guò)log打出，僅在pc端時(shí)才會(huì)打印。

  appId: '', // 必填，公眾號(hào)的唯一標(biāo)識(shí)

  timestamp: , // 必填，生成簽名的時(shí)間戳

  nonceStr: '', // 必填，生成簽名的隨機(jī)串

  signature: '',// 必填，簽名，見(jiàn)附錄1

  jsApiList: [] // 必填，需要使用的JS接口列表，所有JS接口列表見(jiàn)附錄2

});

4.通過(guò)ready接口處理成功驗(yàn)證

  wx.ready(function(){

   //詳細(xì)代碼

});

5.通過(guò)error接口處理失敗驗(yàn)證

wx.error(function(res){});

詳細(xì)頁(yè)面代碼

<script> 
//微信分享朋友圈 
$(function(){ 
 /***用戶點(diǎn)擊分享到微信圈后加載接口接口*******/ 
  var url=window.location.href.split('#')[0]; 
   url = url.replace(/&/g, '%26'); 
  console.log("url:"+url); 
  $.ajax({ 
    url: "<%=basePath%>/lottery/shareToFriend.action?url="+url, 
    type: "POST", 
    async:true, 
    cache: false, 
    dataType: "json", 
    success: function(data){ 
      wx.config({ 
       debug: false, 
       appId: 'wx2948dfef9ef421ee', 
       timestamp:data.timeStamp, 
       nonceStr:data.nonceStr, 
       signature:data.signature, 
       jsApiList: [ 
         'checkJsApi', 
         'onMenuShareTimeline', 
         'hideOptionMenu', 
         'onMenuShareAppMessage' 
       ] 
     }); 
       
     wx.ready(function(){ 
       //wx.hideOptionMenu();/***隱藏分享菜單****/  
       wx.checkJsApi({ 
       jsApiList: [ 
        'getLocation', 
        'onMenuShareTimeline', 
        'onMenuShareAppMessage' 
       ], 
       success: function (res) { 
        //alert(res.errMsg); 
       } 
      }); 
        
      wx.onMenuShareAppMessage({ 
         title: '刮刮樂(lè)', 
         desc: '刮刮樂(lè)開始啦', 
         link: '<%=basePath%>/lottery/lottery.action?lottery.id=${lottery.id}', 
         imgUrl: '<%=basePath%>/resources/qjc/img/start.png', 
         trigger: function (res) { 
          //alert('用戶點(diǎn)擊發(fā)送給朋友'); 
         }, 
         success: function (res) { 
          alert('您已獲得抽獎(jiǎng)機(jī)會(huì)，趕緊去贏大獎(jiǎng)吧～～'); 
          //分享之后增加游戲次數(shù) 
          $.ajax({ 
            url: "<%=basePath%>/lottery/rewardPlayCount.action?openId=${openId}&lotteryId=${lottery.id}&shareType=friend", 
            type: "POST", 
            async:true, 
            cache: false, 
            dataType: "json", 
            success: function(data){ 
               
            } 
           }); 
         }, 
         cancel: function (res) { 
          //alert('已取消'); 
         }, 
         fail: function (res) { 
          alert(res.errMsg); 
         } 
        }); 
       
       // 2.2 監(jiān)聽“分享到朋友圈”按鈕點(diǎn)擊、自定義分享內(nèi)容及分享結(jié)果接口 
       wx.onMenuShareTimeline({ 
         title: '刮刮樂(lè)', 
         desc: '刮刮樂(lè)開始啦', 
         link: '<%=basePath%>/lottery/lottery.action?lottery.id=${lottery.id}', 
         imgUrl: '<%=basePath%>/resources/qjc/img/start.png', 
         trigger: function (res) { 
          //alert('用戶點(diǎn)擊分享到朋友圈'); 
         }, 
         success: function (res) { 
          alert('您已獲得抽獎(jiǎng)機(jī)會(huì)，趕緊去贏大獎(jiǎng)吧～～'); 
          //分享之后增加游戲次數(shù) 
          $.ajax({ 
            url: "<%=basePath%>/lottery/rewardPlayCount.action?openId=${openId}&lotteryId=${lottery.id}&shareType=friendCircle", 
            type: "POST", 
            async:true, 
            cache: false, 
            dataType: "json", 
            success: function(data){ 
               
            } 
           }); 
         }, 
         cancel: function (res) { 
          //alert('已取消'); 
         }, 
         fail: function (res) { 
          alert(res.errMsg); 
         } 
      }); 
        
      wx.error(function (res) { 
          alert(res.errMsg); 
        }); 
      });  
    }, 
    error: function() { 
      alert('ajax request failed!!!!'); 
      return; 
    }  
  }); 
 }); 
 
</script>

java后臺(tái)action代碼：

//微信分享 
  public void shareToFriend(){ 
    HttpServletRequest request = ServletActionContext.getRequest(); 
    String timeStamp = Sha1Util.getTimeStamp();//時(shí)間戳 
    String nonceStr = WxConfig.getUUID();//隨機(jī)字符串，不長(zhǎng)于32位 
    String url=request.getParameter("url"); 
    String signature = WxConfig.getSignature("APPId", "APP_secret", url, timeStamp, nonceStr); 
    request.setAttribute("timeStamp", timeStamp); 
    request.setAttribute("nonceStr", nonceStr); 
    request.setAttribute("url", url); 
    request.setAttribute("signature", signature); 
    WXjssdk result = new WXjssdk(timeStamp,nonceStr,signature,url); 
    CommonUtil.returnMsg(ServletActionContext.getResponse(), new Gson().toJson(result)); 
  }

WxConfig.java代碼

">//jsapi_ticket 
  public final static String WEIXIN_JSAPI_TICKET_URL ="https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi"; 
   
  //access_token  
  public static String getAccessToken(String appId,String appSecret){ 
    String access_token; 
    access_token = mapToken.get("accessToken"); 
    if(access_token==null){ 
      String url = HttpUtil.WEIXIN_HOST_API + "/cgi-bin/token?grant_type=client_credential&appid="+appId+"&secret="+appSecret; 
      String menuJsonStr = HttpUtil.get(url); 
      final Type type = new TypeToken<Map<String, Object>>() {}.getType(); 
      final Map<Object, Object> accessTokenInfo = new Gson().fromJson(menuJsonStr, type); 
      try{ 
        access_token = accessTokenInfo.get("access_token").toString(); 
        Object expires_in = accessTokenInfo.get("expires_in"); 
        mapToken.put("accessToken", access_token); 
        logger.info("access_token:"+access_token+";expires_in:"+expires_in); 
      }catch (JSONException e) { 
        access_token = null; 
        e.printStackTrace(); 
        logger.error("errcode:{}:"+accessTokenInfo.get("errcode")+"errmsg:{}:"+accessTokenInfo.get("errmsg")); 
      } 
    } 
    return access_token; 
  } 
   
  //jsapi_ticket 
  public static String getJsapiTicket(String accessToken){ 
    String ticket; 
    ticket = mapTicket.get("ticket"); 
    if(ticket==null){ 
      String url = HttpUtil.WEIXIN_HOST_API + "/cgi-bin/ticket/getticket?access_token="+accessToken+"&type=jsapi"; 
      String menuJsonStr = HttpUtil.get(url); 
      final Type type = new TypeToken<Map<String, Object>>() {}.getType(); 
      final Map<Object, Object> ticketInfo = new Gson().fromJson(menuJsonStr, type); 
      try{ 
        ticket = ticketInfo.get("ticket").toString(); 
        String expires_in = ticketInfo.get("expires_in").toString(); 
        mapTicket.put("ticket", ticket); 
        logger.info("jsapi_ticket:"+ticket+";expires_in:"+expires_in); 
      }catch (JSONException e) { 
        ticket = null; 
        e.printStackTrace(); 
        logger.error("ticket errcode:{}:"+ticketInfo.get("errcode")+"errmsg:{}:"+ticketInfo.get("errmsg")); 
      } 
    } 
    return ticket; 
  } 
   
   //生成隨機(jī)字符串UUID 
  public static String getUUID(){   
     String uuid = UUID.randomUUID().toString().trim().replaceAll("-", "");   
     return uuid;   
  }  
   
  //JS-SDK Signature 
  public static String getSignature(String appId,String appSecret,String url,String timeStamp,String nonceStr){ 
    String accessToken = getAccessToken(appId,appSecret); 
    String jsapi_ticket = getJsapiTicket(accessToken); 
    logger.info("accessToken==="+accessToken); 
    String signValue = "jsapi_ticket="+jsapi_ticket+"&noncestr="+nonceStr+"×tamp="+timeStamp+"&url="+url; 
    logger.info("微信JS-SDK權(quán)限驗(yàn)證的簽名串："+signValue); 
    //這個(gè)簽名.主要是給加載微信js使用.別和上面的搞混了. 
    String signature = Sha1Util.getSha1((signValue)); 
    logger.info("微信JS-SDK權(quán)限驗(yàn)證的簽名："+signature); 
    return signature; 
  }

另外項(xiàng)目用到的Sha1Util.java和MD5Util.java可以直接在平臺(tái)下載。

您可能感興趣的文章: