vue 配置微信分享

允我心安 提交于 2019-12-01 10:09:05

1. main.js

import WXConfig from '../../assets/js/wx.jsapi';

 

2. wx.jsapi.js

import axios from 'axios'

export default {
    wxShowMenu: function(shareData) {
      var localURL = location.href.split('#')[0];

      if (/iPhone|mac|iPod|iPad/i.test(navigator.userAgent)) {
        var temp_url = sessionStorage.getItem("IOS_shareURL");
        if (temp_url == "" || temp_url == null || temp_url == 'null' || temp_url == undefined || temp_url == "undefined") {
          sessionStorage.setItem("IOS_shareURL", location.href);
          temp_url = location.href;
        } else {
          temp_url = sessionStorage.getItem("IOS_shareURL");
        }

        localURL = temp_url.split('#')[0];
      }

      var param = {
        'url': localURL
      };
      var wxData = shareData.wxData;//分享配置信息
      var Param1= shareData.param1;//假设需传参数1
      var Param2= shareData.param2;//假设需传参数2     var ifshare = shareData.ifshare;//是否开启分享
      var _this = shareData.that;
      axios.get('*****', {//获取config信息链接
        params: param
      }).then(function(res) {
        if (res.status == 200 && res.data.result == 0) {
          var getMsg = res.data.message.ticket;
          wx.config({
            debug: false, //生产环境需要关闭debug模式
            appId: getMsg.appId, //appId通过微信服务号后台查看
            timestamp: getMsg.timestamp, //生成签名的时间戳
            nonceStr: getMsg.nonceStr, //生成签名的随机字符串
            signature: getMsg.signature, //签名
            jsApiList: [ //需要调用的JS接口列表
              'onMenuShareTimeline', //分享给好友
              'onMenuShareAppMessage', //分享到朋友圈         'hideMenuItems'
            ]
          });

          wx.ready(function() {

          /* wx.checkJsApi({
              jsApiList: ["showMenuItems"],
              success: function(res) {
                  wx.showMenuItems({
                      menuList: [
                          'menuItem:share:appMessage', //发送给朋友
                          'menuItem:share:timeline' //分享到朋友圈
                      ]
                  });
              }
          });*/

        if (ifshare == '1') {
          wx.hideAllNonBaseMenuItem();
          return;
        }

          //分享到朋友圈
          wx.onMenuShareTimeline({
            title: wxData.title, // 分享标题
            desc: wxData.info, //分享描述
            link: wxData.shareurl, // 分享链接
            imgUrl: wxData.img, // 分享图标
            success: function(res) {
              // 用户确认分享后执行的回调函数
              var param = {
                param: {
                  param1: Param1,
                  param2: Param2
                }
              }
              _this.axios.get('****', {//分享回调链接,用于自行记录判断之类
                params: param
              }).then(function(res) {
                if (res.status == 200 && res.data.result == 0) {
                  console.log('分享成功');
                }
              }).catch(function(err) {
                console.log(err);
              })
              console.log("分享朋友圈成功返回的信息为:", res);
            },
            cancel: function(res) {
              // 用户取消分享后执行的回调函数
              console.log("取消分享朋友圈返回的信息为:", res);
            }
          });


          //分享给朋友
          wx.onMenuShareAppMessage({
            title: wxData.title, // 分享标题
            desc: wxData.info, //分享描述
            link: wxData.shareurl, // 分享链接
            imgUrl: wxData.img, // 分享图标

            success: function(res) {
              // 用户确认分享后执行的回调函数
              var param = {
                param: {
                  param1: Param1,
                  param2: Param2
                }
              }
              _this.axios.get('****', {//分享回调链接,用于自行记录判断之类
                params: param
              }).then(function(res) {
                if (res.status == 200 && res.data.result == 0) {
                  console.log('分享成功');
                }
              }).catch(function(err) {
                console.log(err);
              })
              console.log("分享朋友圈成功返回的信息为:", res);
            },
            cancel: function(res) {
              // 用户取消分享后执行的回调函数
              console.log("取消分享给朋友返回的信息为:", res);
            }
          });
        });
      }
    })
  },        
}

3. vue中

 let _this = this,    shareData = {
       wxData: wxShareInfo,//分享配置信息
       param1: _this.param1,
       param2: _this.param2,       ifshare: _this.ifshare,
       that: _this
   };

 _this.WXConfig.wxShowMenu(shareData);

 

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!