VUE中的微信分享

vue中分享到朋友圈和分享给朋友。

第一步:安装微信sdk 

npm install weixin-js-sdk;

第二步:引入

import wx from 'weixin-js-sdk';

第三步:使用

/微信分享开始
let _this = this;
_this.share_url = 要分享的url;
_this.share_img = 要分享的图片;
_this.title = 要分享的标题;
   var url1 = location.href;//url不能写死
   $.ajax({
           type : "get",
           url : "http://域名/Wechat/ajaxGetWxConfig?askUrl="+encodeURI(url1),
           dataType : "json",
           async : false,
           success : function(data) {
      _this.appId = data.data.appId;
      _this.timestamp = data.data.timestamp;
      _this.nonceStr = data.data.nonceStr;
      _this.signature = data.data.signature;
           },
           error: function(xhr, status, error) {
               //alert(status);
               //alert(xhr.responseText);
           }
     })
   wx.config({
    
                   debug: false,生产环境需要关闭debug模式
                   appId: _this.appId,//appId通过微信服务号后台查看
                   timestamp: _this.timestamp,//生成签名的时间戳
                   nonceStr: _this.nonceStr,//生成签名的随机字符串
                   signature: _this.signature,//签名
                   jsApiList: [
                       'onMenuShareTimeline','onMenuShareAppMessage'
                   ]
              });
var config = {
        title: _this.title, // 分享标题
        link: _this.share_url, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
        imgUrl: _this.share_img,
        success: function() {
            console.log("success")
        },
        cancel: function() {
               console.log("failf")
        }
   };
   wx.ready(function () {
//                
//        //分享到朋友圈
        wx.onMenuShareTimeline(config);
        //分享给朋友
wx.onMenuShareAppMessage(config);
});

    //微信分享结束

   第四步:遇到的问题;

        安卓机可以正常使用,ios不起作用,但后来发现ios第一次分享不起作用,刷新页面后就可以用了,所以在这里判断了是否是苹果浏览器,如果是则刷新一次页面

let isIOS = function() {//如果是苹果机,分享完成后刷新页面
        var isIphone = navigator
            .userAgent
            .includes('iPhone');
        var isIpad = navigator
            .userAgent
            .includes('iPad');
        return isIphone || isIpad;
    };
    if (isIOS()) {
    
    if(this.stroe.get('isrefresh') == 1){
    this.$router.go(0)
    }

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值