微信分享配置

2018-09-14  本文已影响0人  給我小鱼干

jquery写法:

  <script type="text/javascript" src="./js/jquery.js"></script>
  <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>//需要引入微信分享JS
  <script src="./js/util.js"></script>
  <script type="text/javascript">
    
//为了避免二次分享失败
 var _url = location.href
  if(_url.indexOf("?from=") !=-1) {
    _url = location.origin + location.pathname
    window.location.replace(_url)
  }
  var wechatApi = httpUrl.SHARE+encodeURIComponent(_url)
  $.ajax({
        type: "GET",
        url: wechatApi,
        dataType:'json',
        success: function(res){
          let data = res.data
          window.wx.config({
            debug: false,
            appId: data.appId,
            timestamp: data.timestamp,
            nonceStr: data.nonceStr,
            signature: data.signature,
            jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'chooseImage', 'previewImage']
          })

          window.wx.ready(function(){
            window.wx.onMenuShareTimeline({//分享朋友圈
              title: '【限时福利】200元红包免费领取!',
              link: _url,
              imgUrl: 'http://xxxx.com/user/couponActivity/image/home1.jpg'
            })
            window.wx.onMenuShareAppMessage({//分享好友
              title: '【限时福利】200元红包免费领取!',
              desc:'专业影像定制输出平台,让影像艺术之美走进每个人的生活。',
              link: _url,
              imgUrl: 'http://xxxx.com/user/couponActivity/image/home1.jpg',
              type: 'link'
            })
          })
        }
      }); 

vue写法:

在index.html页面中引入微信的js

let _url = location.href
        let shareurl = _url
        axios({url: config.WECHAT_API+encodeURIComponent(_url)}).then(res => {
          let data = res.data.data
          window.wx.config({
            debug: false,
            appId: data.appId,
            timestamp: data.timestamp,
            nonceStr: data.nonceStr,
            signature: data.signature,
            jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'chooseImage', 'previewImage']
          })
      
          window.wx.ready(() => {
            window.wx.onMenuShareTimeline({
              title: '这是属于我的毕业季',
              link: shareurl,
              imgUrl: 'https://xxx.com/img/biyeji_title.jpg'
            })
            window.wx.onMenuShareAppMessage({
              title: '这是属于我的毕业季',
              desc: '记录大学时光的回忆,不来一本这个是不可能的,这辈子都不可能。',
              link: shareurl,
              imgUrl: 'https://xxx.com/img/biyeji_title.jpg',
              type: 'link'
            })
          })
        })

需要注意的是分享调用的shareURL 与分享链接需要保持高度一致 否则就会报错
而且JS安全域名也要加入

上一篇 下一篇

猜你喜欢

热点阅读