第一次接触微信的js_sdk的配置,最开始从微信的配置开始先,
最先需要阅读文档,进行最基础的了解点击打开链接,先根据配置的内容,分析逻辑
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识
timestamp: , // 必填,生成签名的时间戳
nonceStr: '', // 必填,生成签名的随机串
signature: '',// 必填,签名,见附录1
jsApiList: [] // 必填,需要使用的JS接口列表,即分享朋友,朋友圈,QQ空间等功能
});
下面时我根据自己的项目进行的配置,盆友们可以根据自己的情况进行合适的配置
let self = this
let appID = '分享订阅号的appId'//分享订阅号的appId
let timestamp = (new Date()).valueOf()//获取时间戳
let nonceStr = Math.random().toString(36).substr(2)//生成随机字符串
let signature = ''//签名
let jsapi = ''//jsapi_ticket
let getSignature = ''//获取签名
let url = window.location.origin + window.location.pathname //权限签名算法的url
self.$http.get('http://api.kags.hellohyh.com/v1/weixin/jsapi_ticket')
.then(res => {
if (res.body.code === 1) {
jsapi = res.body.jsapi_ticket
getSignature = 'jsapi_ticket=' + jsapi + '&noncestr=' + nonceStr + '×tamp=' + timestamp + '&url=' + url
signature = SHA1(getSignature)
self.WXcongie(appID, timestamp, nonceStr, signature)
}
})
WXcongie (id, timestamp, nonceStr, signature) { wx.config({ debug: true, appId: id, timestamp: timestamp, nonceStr: nonceStr, signature: signature, jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ'] }) },
上面的部分,你可以通过微信调试平台进行调试,但是你需要注意url不能时本地发localhost地址,否则你配置正确也会报错,这里需要特别注意(我也曾经踩过这个坑)
wx.ready(() => { wx.onMenuShareAppMessage({ title: 'demo', desc: 'this is a demo', link: 'http://movie.douban.com/subject/25785114/', imgUrl: 'http://img3.douban.com/view/movie_poster_cover/spst/public/p2166127561.jpg', trigger: function (res) { alert('用户点击发送给朋友') }, success: function (res) { alert('已分享') }, cancel: function (res) { alert('已取消') }, fail: function (res) { alert(JSON.stringify(res)) } }) wx.error(function (res) { // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。 alert(res) })
完整实现微信分享盆友的功能,你需要看文档,再写另外的方法