uni-app H5微信公众号实现自定义分享


npm安装微信JS-SDK

npm install jweixin-module --save

通过网址下载:

https://unpkg.com/browse/jweixin-module@1.6.0/lib/index.js


//微信js-sdk引入
var jweixin = require('jweixin-module')


// 微信公众号自定义分享
    /**
      * @description  获取微信jsconfig参数
      * <br/>success回调方法的参数就是返回的原始数据
      * @param {string} title   分享标题
      * @param {string} linkUrl 分享页面路径
      * @param {string} imgUrl  图片路径(网络图片路径)
      * @param {string} desc    分享文字描述  
      * @param {function} success 成功后回调的方法
      */
     weixinJSConfig: function (title, linkUrl, imgUrl,desc) {
         var url = window.location.href; //H5当前页面路径
         console.info( '------------url--------------' );
         console.info(url);
         uni.request({
             url:  'https://xxx.com/xxx/getWeixinJSConfig' , //请求后台接口获取权限验证配置参数
             data: {
                 url: url
             },
             method: 'POST' ,
             timeout: 600000,
             success: (res) => {
                 console.info( '----------------------------jsconfig--------------------------' );
                 console.info(res.data);
                 
                 //微信分享权限验证配置参数构造
                 var config = {
                     debug: false , //是否启用调试
                     appId: res.data.appId, //微信公众号appID
                     timestamp: res.data.timestamp, //时间戳
                     nonceStr: res.data.nonceStr,    //签名的随机串
                     signature: res.data.signature,  //签名
                     jsApiList: [                    //需要使用的JS接口列表
                         'checkJsApi' ,
                         'updateTimelineShareData' ,
                         'updateAppMessageShareData' ,
                         'hideMenuItems'
                     ]
                 };
 
                 console.info( '--------------------------jsconfig Value---------------' );
                 console.info(config);
 
                 //微信注入权限验证配置
                 jweixin.config(config);
 
                 //需在用户可能点击分享按钮前就先调用
                 jweixin.ready( function () {
                     jweixin.hideMenuItems({ // 要隐藏的菜单项,只能隐藏“传播类”和“保护类”按钮,所有menu项见附录3
                                            menuList: [ 'menuItem:originPage' , 'menuItem:openWithSafari' , 'menuItem:openWithQQBrowser' , 'menuItem:editTag' , 'menuItem:copyUrl' , 'menuItem:share:qq' , 'menuItem:favorite' , 'menuItem:share:QZone' , 'menuItem:openWithSafari' ]
                     });
                     //分享到朋友圈
                     jweixin.updateTimelineShareData({
                         title: title, // 分享标题
                         link: 'H5部署域名' + linkUrl, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                         imgUrl: imgUrl, // 分享图标
                         success: function () {
                             // alert("updateTimelineShareData");
                         }
                     })
 
                     //分享给朋友
                     jweixin.updateAppMessageShareData({
                         title: title, // 分享标题
                         desc: desc, // 分享描述
                         link: 'H5部署域名' + linkUrl, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                         imgUrl: imgUrl, // 分享图标
                         success: function () {
                             // alert("updateAppMessageShareData");
                         }
                     })
                 });
             }
         });
     },
 

 

页面调用:

onLoad() {
	this.weixinJSConfig('分享标题','https://xxx.com/pages/tab/index.html', 'https://xxx.com/image.jpg','分享描述')
},

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM