环境:PHP TP5框架
后端代码:
/*** 使用json给前端返回必要的微信JS-SDK数据* @return \think\response\Json*/public function get_js_api_data(){//获取微信accesstoken 此处不做赘述$AccessToken = WechatService::getAccessToken();//生成一个随机字符串 传给前端用$nonceStr = substr(md5(time()), '0', '16');//生成一个时间戳 传给前端用$timestamp = time();//自己公众号的appid$appid = 'wx694*******a2b';//从前端接收到的调用接口页面的完整URL$verify_url = urldecode(input('url'));//获取js_ticket 此处不做赘述$js_ticket = $this->get_js_ticket($AccessToken);//拼接字符串加密$s_str = "jsapi_ticket=" . $js_ticket . "&noncestr=" . $nonceStr . "×tamp=" . $timestamp . "&url=" . $verify_url;//直接使用sh1加密$signature = sha1($s_str);//打包成json数组$ret_arr = ['appId' => $appid,'nonceStr' => $nonceStr,'signature' => $signature,'timestamp' => $timestamp,'share_url' => 'http://*******.*********/index/index/index',];return json($ret_arr);}
前端代码:
头部引入微信的js包
<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>$(function () {//对当前页面的url进行编码var Url = encodeURIComponent(location.href.split('#')[0]);//这几个参数都是后台从微信公众平台获取到的var nonceStr, signature, timestamp, appId, shareUrl;$.ajax({//后台获取参数接口url: "http://*******.*********/index/share_test/get_js_api_data",type: 'POST',//将当前页面的url传到后台data: {url: Url,},success: function (data) {//得到参数var appId = data.appId;var nonceStr = data.nonceStr;var signature = data.signature;var timestamp = data.timestamp;var shareUrl = data.share_url;//通过微信config接口注入配置wx.config({debug: true, // 默认为false 为true的时候是调试模式,会打印出日志appId: appId,timestamp: timestamp,nonceStr: nonceStr,signature: signature,jsApiList: ['checkJsApi','onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ','onMenuShareWeibo']});//配置自定义分享内容window.share_config = {'share': {'imgUrl': 'http://*******.*********/h5/static/1637812.759501/img/LicensePlateQuery1.8bb7f30a.png', // 这里是需要展示的图标'desc': '120秒,48项天赋解析,90分钟专家咨询解读,深度剖析您的天赋人生。成为测测科技合伙人,尊享至多11项专属超值礼遇。', // 这是分享展示的摘要'title': '90%的人都认可测测科技天赋智能测评|合伙人现正招募中', // 这是分享展示卡片的标题'link': shareUrl, // 这里是分享的网址'success': function (rr) {//console.log('成功' + JSON.stringify(rr))},'cancel': function (tt) {//console.log('失败' + JSON.stringify(tt));}}};wx.ready(function () {wx.onMenuShareAppMessage(share_config.share); // 微信好友wx.onMenuShareTimeline(share_config.share); // 微信朋友圈wx.onMenuShareQQ(share_config.share); // QQ});},error: function (err) {},});})
</script>
完成