liren123.cn
1.公众号后台设置
先拿测试号测试
微信公众号后台---开发者工具----公众平台测试账号
测试账号随便玩,不影响主体账号
上图红框,每个都有用,先拿appID,appsecret
URL填写自己服务器后台的接口, token自定义,后面有用,域名绑定自己的域名
注意,要关注这个测试号才可以调试消息接收
2.服务器后台设置
index.js文件(有些是在app.js,这个看自己情况,我这个启用了路由)
router.get('/wxJssdk', (req, res) => {
let wx = req.query
let token = 'wxexpress' //这里跟微信公众号后台设置token保持一致
let timestamp = wx.timestamp
let nonce = wx.nonce
// 1）将token、timestamp、nonce三个参数进行字典序排序
let list = [token, timestamp, nonce].sort()
// 2）将三个参数字符串拼接成一个字符串进行sha1加密
let str = list.join('')
let result = sha1(str)
// 3）开发者获得加密后的字符串可与signature对比，标识该请求来源于微信
if (result === wx.signature) {
res.send(wx.echostr) // 返回微信传来的echostr，表示校验成功，此处不能返回其它
} else {
res.send(false)
}
});
index.js文件 以下这部分拿access_token,jsapi_ticket 按开放文档要求生成签名
router.post('/getJssdk', (req, res) => {
const grant_type = 'client_credential'
const appid = '填你的appid ' //在上图测试号配置界面
const secret = '填你的secret ' //在上图测试号配置界面
request('https://api.weixin.qq.com/cgi-bin/token?grant_type=' + grant_type + '&appid=' + appid + '&secret=' + secret, (err, response, body) => {
let access_token = JSON.parse(body).access_token
//console.log("access_token="+access_token)
request('https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=' + access_token + '&type=jsapi', (err, response, body) => {
let jsapi_ticket = JSON.parse(body).ticket
//console.log("jsapi_ticket="+jsapi_ticket)
let nonce_str = '2345678' // 密钥，字符串任意，可以随机生成
let timestamp = new Date().getTime() // 时间戳
let url = req.query.url // 使用接口的url链接，不包含#后的内容
// 将请求以上字符串，先按字典排序，再以'&'拼接，如下：其中j > n > t > u，此处直接手动排序
let str = 'jsapi_ticket=' + jsapi_ticket + '&noncestr=' + nonce_str + '×tamp=' + timestamp + '&url=' + url
// 用sha1加密
let signature = sha1(str)
//console.log("signature="+signature)
res.send({ //发送签名给前端
appId: appid,
timestamp: timestamp,
nonceStr: nonce_str,
signature: signature,
})
})
})
})
3.前端html页面
//按微信公众号平台开放文档引用,https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#3
<script type="text/javascript">
$(function(){
var url=window.location.href.split('#')[0];
url = url.replace(/&/g, '%26');
console.log("url:"+url);
$.ajax({
url: "/getJssdk?url="+url, //此处获取后端发过来的appId, timestamp,nonce_str,signature,
type: "POST",
async:true,
cache: false,
dataType: "json",
success: function(data){
wx.config({
debug: false,
appId: data.appId,
timestamp:data.timestamp,
nonceStr:data.nonceStr,
signature:data.signature,
jsApiList: [
'updateTimelineShareData',
'updateAppMessageShareData'
]
});
wx.ready(function(){
wx.updateAppMessageShareData({ //转发好友
title: '测试',
desc: '测试',
link: window.location.href,
imgUrl: 'https://liren123.cn/img/logo2.png', //缩略图链接,目前只支持url,不支持base64
});
wx.updateTimelineShareData({ //转发朋友圈
title: '测试',
desc: '测试',
link: window.location.href,
imgUrl: 'https://liren123.cn/img/logo2.png',
});
wx.error(function (res) {
// alert('wx.error:'+res.errMsg);
});
});
},
error: function() {
//alert('ajax request failed!!!!');
return;
}
});
});
</script>
