企业微信jssdk自定义
业务中有个需要自定义分享的功能
通过概述 | 微信开放文档官方文档，与后端伙伴协作完成
首先需要后端通过接口返回appId, timestamp(生成签名的时间戳), nonceStr(生成签名的随机串),signature( 签名)这四个字段
调取接口的时候需要传当前页面的url过去，url建议location.href.split('#')[0]获取,而且需要encodeURIComponent。如下
const loacationUrl = encodeURIComponent(location.href.split('#')[0])如下代码，data是拿到的后端返回的数据
wx.config({
debug: true,
appId: data.appId,
timestamp: data.timestamp, // 生成签名的时间戳
nonceStr: data.nonceStr, // 生成签名的随机串
signature: data.signature, // 签名
jsApiList: ['updateAppMessageShareData', 'updateTimelineShareData', 'showOptionMenu'],
})
wx.ready(function () {
console.log('WechatShareData.icon', WechatShareData.icon)
wx.showOptionMenu()
wx.updateAppMessageShareData({
title: '标题',
link: '路径地址',
desc: '描述',
imgUrl: '图片地址url',
success: function () {},
})
wx.updateTimelineShareData({
title: '标题',
link: '路径地址',
desc: '描述',
imgUrl: '图片地址url',
success: function () {},
})
})
wx.error(function (res) {
console.log('error', res)
})如果自定义的分享内容没生效，设置debug为true，可以把错误信息alert出来
遇到的问题：
- invalid signature签名错误。建议按如下顺序检查：
确认签名算法正确，可用微信 JS 接口签名校验工具 页面工具进行校验。
确认 config 中nonceStr（js中驼峰标准大写S）, timestamp与用以签名中的对应 noncestr , timestamp一致。
确认 url 是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认)，包括'http(s)://'部分，以及'？'后面的 GET 参数部分,但不包括'#'hash后面的部分。
确认 config 中的 appid 与用来获取 jsapi_ticket 的 appid 一致。
确保一定缓存access_token和jsapi_ticket。
确保你获取用来签名的 url 是动态获取的，动态页面可参见实例代码中 php 的实现方式。如果是 html 的静态页面在前端通过 ajax 将url传到后台签名，前端需要用 js 获取当前页面除去'#'hash部分的链接（可用location.href.split('#')[0]获取,而且需要encodeURIComponent），因为页面一旦分享，微信客户端会在你的链接末尾加入其它参数，如果不是动态获取当前链接，将导致分享后的页面签名失败。
-
调试状态下出现
noPermissionJsApi错误
具体错误为：
noPermissionJsApi:["updateAppMessageShareData", "updateTimelineShareData"],errMsg: "config:ok"`
登录公众号后台，进入 接口权限 → 分享接口，检查 分享到朋友圈 和 分享给朋友 是否已经开启。
具体接口权限可参考微信接口权限 官方文档。