100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > 微信js-sdk实现“分享到朋友圈”和“发送给朋友”

微信js-sdk实现“分享到朋友圈”和“发送给朋友”

时间:2022-02-28 14:19:06

相关推荐

微信js-sdk实现“分享到朋友圈”和“发送给朋友”

微信接口文档地址:https://mp./wiki?t=resource/res_main&id=mp1421141115&token=&lang=zh_CN

实现步骤:

1.绑定域名

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。(特别提示不需要加上http或者https,吃过亏)

2.页面引入js文件

<script src="http://res./open/js/jweixin-1.0.0.js"></script>

<script src="https://res./open/js/jweixin-1.0.0.js"></script>

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

wx.config({

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

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

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

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

signature: '',// 必填,签名,见附录1

jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2

});

4.通过ready接口处理成功验证

wx.ready(function(){

//详细代码

});

5.通过error接口处理失败验证

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

详细页面代码

<script>//微信分享朋友圈$(function(){/***用户点击分享到微信圈后加载接口接口*******/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: '刮刮乐',desc: '刮刮乐开始啦',link: '<%=basePath%>/lottery/lottery.action?lottery.id=${lottery.id}',imgUrl: '<%=basePath%>/resources/qjc/img/start.png',trigger: function (res) {//alert('用户点击发送给朋友');},success: function (res) {alert('您已获得抽奖机会,赶紧去赢大奖吧~~');//分享之后增加游戏次数$.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 监听“分享到朋友圈”按钮点击、自定义分享内容及分享结果接口wx.onMenuShareTimeline({title: '刮刮乐',desc: '刮刮乐开始啦',link: '<%=basePath%>/lottery/lottery.action?lottery.id=${lottery.id}',imgUrl: '<%=basePath%>/resources/qjc/img/start.png',trigger: function (res) {//alert('用户点击分享到朋友圈');},success: function (res) {alert('您已获得抽奖机会,赶紧去赢大奖吧~~');//分享之后增加游戏次数$.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后台action代码:

//微信分享public void shareToFriend(){HttpServletRequest request = ServletActionContext.getRequest();String timeStamp = Sha1Util.getTimeStamp();//时间戳String nonceStr = WxConfig.getUUID();//随机字符串,不长于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代码

<pre name="code" class="java">//jsapi_ticketpublic final static String WEIXIN_JSAPI_TICKET_URL ="https://api./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_ticketpublic 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;}//生成随机字符串UUIDpublic static String getUUID(){ String uuid = UUID.randomUUID().toString().trim().replaceAll("-", ""); return uuid; } //JS-SDK Signaturepublic 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权限验证的签名串:"+signValue);//这个签名.主要是给加载微信js使用.别和上面的搞混了.String signature = Sha1Util.getSha1((signValue));logger.info("微信JS-SDK权限验证的签名:"+signature);return signature;}

另外项目用到的

Sha1Util.java和MD5Util.java可以直接在平台下载。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。