微信内置浏览器进行分享,只能监听微信自带的分享按钮,自定义分享的图标什么的,不可能主动触发分享,可以引用微信公众平台的自定义分享接口,也就是JSSDK的相关API,文档地址如下:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.htm
在微信公众平台注册一个公众号(必须为企业资质的订阅号,并且开通分享接口的权限:需要企业认证并缴费);开发---接口权限
设置---公众号设置---功能设置,填写有效的JS接口安全域名;
开发---基本设置---IP白名单,填写项目所在的服务器IP地址;
在vue项目中引入jssdk,微信为了方便用户使用,将官方的JSSDK发布到了npm上,有一个叫weixin-js-sdk的是针对CommonJs规范提出的,需要使用require引入;另一个是叫weixin-jsapi,是针对ES6提出的,这个时候我们可以使用import方式引入;
出于安全考虑,服务端获取签名:
获取access_token,有效期7200秒,在服务端进行缓存,请求地址为:https://developers.weixin.qq.com/doc/offiaccount/Basic_Information/Get_access_token.html
通过第一步拿到的access_token获取jsapi_ticket,有效期7200秒,在服务端进行缓存,请求地址为:https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi
将noncestr(随机字符串), 有效的jsapi_ticket,timestamp(时间戳), url(当前网页的URL,不包含#及其后面部分)按照ASCII码从小到大排序,组织成URL键值对的形式,并对整个字符串进行sha1加密,生成签名;