此文档做回顾。
先上官方文档：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);
}
});
})以上就是整个功能的全部代码了。第一次写博客思路上可能有些乱，我会在之后去整理下这块的文字描述。
不知道有没有同学发现这个功能其实有个BUG，就是文档中说jsapi_ticket的有效期为7200秒。需要全局缓存这货，但是在代码中并没有处理这块的逻辑。所以，你们不要忘记处理这块的逻辑啊~
===================== 新添加内容：
说明：分享缩略图要使用外网能够访问到的图片路径，不要使用项目路径下的图片路径，否则分享的时候是不会显示的。