1.composer 引入 easyWeChat架包 composer require overtrue/wechat:~4.0 -vvv (文档地址 https://www.easywechat.com/docs/4.1/basic-services/jssdk
)
- 控制器实例化 操作类 并返回数据
public function index()
{
//公众号配置信息
$config = [
'app_id' => env('WECHAT_OFFICIAL_ACCOUNT_APPID'),
'secret' => env('WECHAT_OFFICIAL_ACCOUNT_SECRET'),
'response_type' => 'array',
];
$app = Factory::officialAccount($config);
$result = $app->jssdk->buildConfig([],false,false, $json = true);//获取分享所需参数
$result = json_decode($result,true);
/**
* 分享返回的参数
*/
$nonceStr = $result['nonceStr'];
$timestamp = $result['timestamp'];
$url = $result['url'];
$signature = $result['signature'];
return view('test',compact('nonceStr','timestamp','url','signature')); //传递到页面上
}
3.页面js处理
<script type="text/javascript">
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: 'wx85194f720bdcd83a', // 必填,公众号的唯一标识
timestamp:"{{$timestamp}}" , // 必填,生成签名的时间戳
nonceStr: "{{$nonceStr}}", // 必填,生成签名的随机串
signature: "{{$signature}}",// 必填,签名
jsApiList: ['updateAppMessageShareData']// 必填,需要使用的JS接口列表
});
wx.ready(function () { //需在用户可能点击分享按钮前就先调用
wx.updateAppMessageShareData({
title: '测试', // 分享标题
desc: '测试描写', // 分享描述
link: "{{$url}}", // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1573007888&di=13ec4f4fc50f4f52a82755a7a72eed7e&imgtype=jpg&er=1&src=http%3A%2F%2Fgss0.baidu.com%2F-Po3dSag_xI4khGko9WTAnF6hhy%2Fzhidao%2Fpic%2Fitem%2Fd1a20cf431adcbef6df30761a0af2edda2cc9f95.jpg', // 分享图标
success: function () {
// 设置成功
}
})
});
</script>
网友评论