公众号分享link 不能配置其他域名_java版微信分享功能（支持分享给好友/分享到朋友圈）...

最新推荐文章于 2024-04-18 11:20:36 发布

weixin_39613291

最新推荐文章于 2024-04-18 11:20:36 发布

阅读量150

点赞数

文章标签：公众号分享link 不能配置其他域名

点击上方[全栈开发者社区]→右上角[...]→[设为星标⭐]

先上官方文档：http://mp.weixin.qq.com/wiki/home/index.html

做之前建议先过遍文档，文档都说的清晰明了。

如果已经看过文档，那我们一起整理下JSSDK的流程步骤：

绑定域名

登陆微信公众号，根据下列路径找到添加页面：

微信公众号 - 公众号设置 - 功能设置 - JS接口安全域名

添加步骤：

1.下载txt文件(MP_verify_0HU5eN6Tzfwovxxx.txt)，放到项目根目录下；

2.添加项目访问域名地址，点击保存。在需要调用JS接口的页面引入js文件(页面不支持https的换成http://)：

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

config接口权限验证

wx.config({    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。    appId: '', // 必填，公众号的唯一标识    timestamp: , // 必填，生成签名的时间戳    nonceStr: '', // 必填，生成签名的随机串    signature: '',// 必填，签名    jsApiList: [] // 必填，需要使用的JS接口列表});

这里着重说下jsApiList参数：

将要用到的接口用引号形式写进去，逗号隔开('','')；

这里添加的js接口名称要跟下面的wx.ready()里面的接口顺序对应。

js接口名称见官方文档。

通过ready接口处理成功验证：

wx.ready(function(){    // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。});

备注：里面的js接口顺序一定要按照config()接口中的参数jsApiList中的js接口顺序排列。通过error接口处理失败验证：

wx.error(function(res){    // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。});

Over... 额，当然，只是前端的流程步骤结束了。接下来我们看后台(java)是怎么处理config()接口中需要的那些参数的。这里需要用到公众号的几个参数： appid、secret 。直接上后台代码：

public class WeixinShareController extends Controller{    public void index(){        // 微信appid    String appid = "xxx";    // 微信secret    String secret = "xxx";    // 初始化access_token    String access_token = "";    //  获取URL 这里的URL指的是需要分享的那个页面地址,建议这里不要写成固定地址，而是获取当前地址.    String url = getPara("url");        // 创建通过Api获取Token的链接与参数    String requestTokenUrl = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=SECRET";    requestTokenUrl = requestTokenUrl.replace("APPID", appid);    requestTokenUrl = requestTokenUrl.replace("SECRET", secret);            JSONObject jsonObjectToken = CommonUtil.httpsRequest(requestTokenUrl, "GET", null);    if(StrKit.notNull(jsonObjectToken)){      // 创建日期赋值为当前日期      createDate = new Date().getTime()/1000;      // 获取Token值      access_token = jsonObjectToken.getString("access_token");      // 获取Token有效期值      expires_in = jsonObjectToken.getLong("expires_in");    }        String requestUrl = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi";    requestUrl = requestUrl.replace("ACCESS_TOKEN", access_token);    // 获取凭证    JSONObject jsonObject = CommonUtil.httpsRequest(requestUrl, "GET", null);    if(StrKit.notNull(jsonObject)){      try {        String ticket = jsonObject.getString("ticket");        String noncestr = WebUtils.getRandom(7);        long timestamp = new Date().getTime()/1000;                String param = "jsapi_ticket="+ticket+"&noncestr="+noncestr+"×tamp="+timestamp+"&url="+url;        String signature = DigestUtils.shaHex(param);                WeixinShare weixinShare = new WeixinShare();        weixinShare.setWxNoncestr(noncestr);        weixinShare.setWxTimestamp(timestamp);        weixinShare.setWxSignature(signature);        setAttr("weixinShare",weixinShare);        setAttr("appid",appid);      } catch (Exception e) {        e.printStackTrace();        setAttr("errorMessage","服务器异常！");      }    }    renderJson();  }}

前端代码：

这里建议ur参数不要写成固定地址，用提供的获取当前路径的方法获取，可以保证该js的重用：

var url    = location.href.split('#')[0];

代码：

$(function(){  var title        = $("#title").val();  var desc      = $("#desc").val();  var name      = $("#program_name").val();  var imgUrl       = $("#imgurl").val();  var path   = $("#path").val();  var url    = location.href.split('#')[0];    var signature,timestamp,noncestr,appid;   /*微信分享*/   $.ajax({         url:path+"/weixinshare",         type:'GET',         data:{           url : url         },         success:function (data) {           signature = data.weixinShare.wx_signature;           timestamp = data.weixinShare.wx_timestamp;           noncestr = data.weixinShare.wx_noncestr;           appid = data.appid;           wx.config({                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。                appId: appid, // 必填，公众号的唯一标识                timestamp: timestamp, // 必填，生成签名的时间戳                nonceStr: noncestr, // 必填，生成签名的随机串                signature: signature,// 必填，签名                jsApiList: ['onMenuShareAppMessage','onMenuShareTimeline'] // 必填，需要使用的JS接口列表            });                      wx.ready(function(){            //分享给朋友             wx.onMenuShareAppMessage({               title: title, // 分享标题               desc: desc, // 分享描述               link: path, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致               imgUrl:imgUrl, // 分享图标s               type: 'link', // 分享类型,music、video或link，不填默认为link               dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空               success: function () {               // 用户确认分享后执行的回调函数//                 alert("OK");               },               cancel: function () {               // 用户取消分享后执行的回调函数//                 alert("fail");               }               });             //分享给朋友圈             wx.onMenuShareTimeline({                  title: title, // 分享标题                  link: path, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致                  imgUrl: imgUrl, // 分享图标                  success: function () {                  // 用户确认分享后执行的回调函数              },             });           });         },         error:function(error){             console.log(error);         }  });   })

以上就是整个功能的全部代码了。

原文链接：https://blog.csdn.net/IbelieveSmile/article/details/80176563

留言打卡30天，祝贺第一批坚持打卡的小伙伴们满月啦，继续努力！