首先 :小编恭喜你已经掉入uniapp的坑,你是别想爬出去了,那是不可能的!!!
大家都被uniapp的“一套代码,适用多个平台”所吸引,但是都是成年人,天底下有那么好的事情吗?是没有的。
但是今天小编给大家带来的“自定义微信分享卡片内容”是一个在微信开发中常用到的功能,自然uniapp也是会有的,下面就听小编来说:
uniapp官方并没有特别指出微信分享卡片和分享朋友圈的功能,但是好在微信团队的给力,给我们提供了方法,我们只需要调用此方法就可以了。
-----在 uniapp 中可以使用模块方式引用微信 js-sdk ,微信官网直接下载的使用有问题,可以使用 jweixin-module。
安装
- NPM安装方式(不会用NPM就不要用这种方式)
复制代码npm install jweixin-module --save
- 下载使用方式
下载地址:https://unpkg.com/jweixin-module@1.6.0/lib/index.js
使用
复制代码var jweixin = require(‘jweixin-module‘)
jweixin.ready(function(){
// TODO
});
完整API
接下来是具体的使用方法:
前面的一系列操作完成后引入对应的组件,或者引入到main.js里。
1、首先咱们还是得获取微信分享的四要素:appId, nonceStr, signature, timestamp(具体意思请到微信官网查询),一般是通过接口,有后端提供。
2、就要通过jweixin的方法进行分享了,具体的代码:
let { appId, nonceStr, signature, timestamp } = res let title = this.shareTitle let imgUrl = this.shareImage let desc = this.shareSubtitle let link = this.shareLink jweixin.config({ // debug: true, appId: appId, // 必填,公众号的唯一标识 timestamp: timestamp, // 必填,生成签名的时间戳 nonceStr: nonceStr, // 必填,生成签名的随机串 signature: signature, // 必填,签名 jsApiList: [‘updateAppMessageShareData‘, ‘updateTimelineShareData‘] // 必填,需要使用的JS接口列表 }) jweixin.ready(function() { jweixin.updateAppMessageShareData({ title, // 分享标题 desc, // 分享描述 link: link, imgUrl, // 分享图标 success: function() { // 设置成功 } }) jweixin.updateTimelineShareData({ title, // 分享标题 link: link, imgUrl, // 分享图标 success: function() { // 设置成功 } }) }) jweixin.error(function(res) { // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。 })
3、title, // 分享标题,desc, // 分享描述,link: //分享链接,imgUrl, // 分享图标 这四要素就是你要显示在微信卡片上的内容,但是如果分享朋友圈的话是没有分享描述的。
4、jsApiList: [‘updateAppMessageShareData‘, ‘updateTimelineShareData‘] // 必填,需要使用的JS接口列表,这是必填项,如果只想分享给朋友或者是朋友圈那么可以只写其中一个,相对应的js也不需要。
好了,这就是微信发送给朋友和朋友圈的全套js,小伙伴们看懂了吗,可以评论留言,我会第一时间回复。