羊仔
羊仔
  • 发布:2019-08-12 11:37
  • 更新:2022-08-24 15:58
  • 阅读:12221

nui-app h5微信分享的jweixin demo

分类:uni-app

第一步:npm install jweixin-module --save
第二步:在main.js里或者具体的页面这样写

import jswx from 'jweixin-module/out/index.js'  
 let wx_config = “后台返回的config”  

                     jswx.config(  
                     {  
                         debug:false,  
                         appId:wx_config.appId, // 必填,公众号的唯一标识  
                         timestamp:wx_config.timestamp , // 必填,生成签名的时间戳  
                         nonceStr: wx_config.nonceStr, // 必填,生成签名的随机串  
                         signature: wx_config.signature,// 必填,签名  
                         jsApiList:wx_config.jsApiList // 必填,需要使用的JS接口列表          
                     }                                 
                     );  
            jswx.ready(()=>{  
                                          //分享给朋友  
                    jswx.onMenuShareTimeline({  
                        title: 'xxxx', // 分享标题  
                        link: 'https://www.xxx.com', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致  
                        imgUrl: 'https:///www.xxx.com/icon.png', // 分享图标  
                        success: function () {  
                        // 用户点击了分享后执行的回调函数  
                    },  
                     });      
                                         //分享朋友圈  
                     jswx.onMenuShareAppMessage({  
                            title: 'xxxx', // 分享标题  
                            desc: 'xxxx', // 分享描述  
                            link: 'https://www.xxx.com', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致  
                        imgUrl: 'https:///www.xxx.com/icon.png', // 分享图标  
                            success: function () {  
                             uni.showToast({  
                                    title: '分享成功',  
                                    duration: 2000  
                                });  
                            }  
                            });  
                })  

//以上

亲测可用,再有问题就是后台的锅了,怼他们。。。。。还有一个,如果一切正常报:invalid Signature ,那有可能是后台需要获取你前端当前页面的href,否则一直会报这个错,你获取window.location.href给它,如果是tp5的话,应该是

$url = ‘当前链接(前端获取分享那页的链接:window.location.href,传过来这里)’//这步非常重要,官方文档都没有的  
$string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr&timestamp=$timestamp&url=$url";  

    $signature = sha1($string);

生成签名的这个位置

最终效果

4 关注 分享
1***@163.com 5***@qq.com damdmen qq1563204347

要回复文章请先登录注册

aliang888

aliang888

这个支持openTagList吗?
2020-07-16 16:00
羊仔

羊仔 (作者)

回复 w***@163.com :
https://ext.dcloud.net.cn/plugin?id=932 我的这个插件里有
2020-03-16 14:53
w***@163.com

w***@163.com

问下api/api.js文件可以分享一下吗,感谢
2020-03-16 10:19
羊仔

羊仔 (作者)

回复 1***@163.com :
需要分享不同的内容每个页面都得写,可以在main里封装一下
2020-01-04 08:26
1***@163.com

1***@163.com

在main.js里面写吗,还是在每个页面里面写?
2020-01-03 19:56
羊仔

羊仔 (作者)

回复 Ayaw :
注意一下我文章的最后几句话
2020-01-03 16:48
Ayaw

Ayaw

pc上及手机别的浏览器没有错,log能出来,但在微信浏览器就出现invalid signature,是啥问题呀大佬
2020-01-03 16:42
2***@qq.com

2***@qq.com

$url = ‘你的当前链接(window.location.href)’ 那个链接啊~ tp5
该怎修改啊~ 大佬 一直报invalid Signature 这个错
2019-12-26 10:40
羊仔

羊仔 (作者)

回复 quanpeifeng :
我这个是h5的分享哈,其他的用不了,如果是h5的报这个npm install一下
2019-12-13 10:44
quanpeifeng

quanpeifeng

大佬!sdk uncaught third Error
Cannot read property 'jWeixin' of undefined
TypeError: Cannot read property 'jWeixin' of undefined 这个错误是什么原因呀
2019-12-12 14:04