最近、WeChatでの共有と転送をリクエストしましたが、話をするのは頭痛の種です。私は通常TwitterとWeiboを使用しており、この必要性のためにWeChatを特別に配置しました。
1.テスト公式アカウントに登録し ますhttps://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login
インターフェイス構成とjsセキュリティドメイン名は、独自のオンラインテスト環境アドレスを入力します
トークンの記入
2. githubhttps ：//github.com/binarywang/weixin-java-mp-demo-springbootでデモプロジェクトを検索し ます
見てください、かなりたくさんのことがあります、そして私はそれを見ることさえ気にしません。
3.プロジェクト構成ファイルにテンプレートがあり、それをコピーします
4.公式アカウント管理のインターフェース構成では、コントローラーのアドレスを使用します（コピーは/ wx / portal /（appid）です。パスを覚えにくい場合は、独自のアドレスに変更してください）
5. wx.configは、署名を生成し、コピーを続行するためにバックエンドを必要とします（私はそれをコピーしました、あなたは私のものをコピーします）
@GetMapping("/wechatParam")
public ResponseModel getWXConfigSignature(String url) {
WxMpProperties.MpConfig config = wxMpProperties.getConfigs().get(0);
long timeStampSec = System.currentTimeMillis() / 1000;
String timestamp = String.format("%010d", timeStampSec);
String nonceStr = Fun.randString(8);
String[] urls = url.split("#");
String newUrl = urls[0];
logger.info("随机串："+nonceStr+", 获取签名URL: " + newUrl);
JSONObject respJson = new JSONObject();
String wxJsapiTicket = getWXJsapiTicket(config.getAppId(),config.getSecret());
String[] signArr = new String[]{"url=" + newUrl, "jsapi_ticket=" + wxJsapiTicket, "noncestr=" + nonceStr, "timestamp=" + timestamp};
Arrays.sort(signArr);
String signStr = String.join("&",signArr);
String resSign = DigestUtils.sha1Hex(signStr);
logger.info("返回的签名：" + resSign);
respJson.put("appId", config.getAppId());
respJson.put("timestamp", timestamp);
respJson.put("nonceStr", nonceStr);
respJson.put("signature", resSign);
respJson.put("url", url);
logger.info(respJson.toJSONString());
return ResponseModel.newSuccess(respJson);
}
private String getWXJsapiTicket(String appid,String secret) {
ValueOperations valueOperations = redisTemplate.opsForValue();
String ticket = (String) valueOperations.get(appid);
if (Strings.isBlank(ticket)) {
String url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=" + getWXaccessToken(appid,secret) + "&type=jsapi";
String resp = restTemplate.getForObject(url, String.class);
JSONObject resJson = JSONObject.parseObject(resp);
logger.info("获取到ticket：" + resJson.getString("ticket"));
valueOperations.set(appid, resJson.getString("ticket"), 2, TimeUnit.HOURS);
return resJson.getString("ticket");
}
return ticket;
}
private String getWXaccessToken(String appid,String secret) {
String url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid="+appid+"&secret="+secret;
String resp = restTemplate.getForObject(url, String.class);
JSONObject resJson = JSONObject.parseObject(resp);
logger.info("获取到access_token：" + resJson.getString("access_token"));
return resJson.getString("access_token");
}
私はロジックを気にしません、それはwechatParamインターフェースです（wxMpPropertiesはAutowiredによって取得されます）
6.フロントエンドは、署名を取得するためのバックエンドを見つけ、共有イベントを監視し、jsコードを自分でテストします。
<h1 id="msg"></h1>
<script>
$(function(){
var url = location.href.split('#').toString();//url不能写死
$.ajax({
type : "get",
url : "/wx/{公众号的appid}/wechatParam",
dataType : "json",
async : false,
data:{url:url},
success : function(data) {
wx.config({
debug: true,生产环境需要关闭debug模式
appId: data.data.appId,//appId通过微信服务号后台查看
timestamp: data.data.timestamp,//生成签名的时间戳
nonceStr: data.data.nonceStr,//生成签名的随机字符串
signature: data.data.signature,//签名
jsApiList: [//需要调用的JS接口列表
'checkJsApi',//判断当前客户端版本是否支持指定JS接口
'onMenuShareTimeline',//分享给好友
'onMenuShareAppMessage'//分享到朋友圈
]
});
alertx('config is over:'+JSON.stringify(data.data));
},
error: function(xhr, status, error) {
alertx(JSON.stringify(status));
alertx(JSON.stringify(xhr));
alertx(JSON.stringify(error));
}
});
});
wx.ready(function () {
var link = window.location.href;
var protocol = window.location.protocol;
var host = window.location.host;
alertx('wx is ready');
//分享朋友圈
wx.onMenuShareTimeline({
title: '分享朋友圈！',
link: link,
imgUrl: protocol+'//'+host+'/resources/images/icon.jpg',// 自定义图标
trigger: function (res) {
// 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回.
alertx('click shared');
},
success: function (res) {
alertx('shared success');
//some thing you should do
},
cancel: function (res) {
alertx('shared cancle');
},
fail: function (res) {
alertx(JSON.stringify(res));
}
});
//分享给好友
wx.onMenuShareAppMessage({
title: '分享给好友！', // 分享标题
desc: '分享给好友123！', // 分享描述
link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: protocol+'//'+host+'/resources/images/icon.jpg', // 自定义图标
type: 'link', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户确认分享后执行的回调函数
alertx('shared success!');
},
cancel: function () {
// 用户取消分享后执行的回调函数
alertx('shared cancle!');
}
});
wx.error(function (res) {
alertx(JSON.stringify(res));
});
});
function alertx(msg) {
alert(msg);
console.log(msg);
$('#msg').append(msg+'<br/>');
}
</script>