移动端 浏览器唤起【微信分享】

项目场景:

目前遇到个需求,就是创建预定数据后,向用户下发短信,短信链接打开后有个分享功能,需要分享给微信好友,进行用户裂变


          <div class="share" @click="share">
            <svg class="share_svg">
              <image xlink:href="../../assets/images/share.svg" />
            </svg>
            <p>分 享</p>
          </div>

	methods:{
    
    
		// 分享按钮
    share() {
    
    
      console.log('分享')
      getRandomCode().then(res => {
    
    
        if (res) {
    
    
          let thisName = encodeURI(this.thisPersonName, 'utf-8')
          this.shareUrlLink = `${
    
    process.env.VUE_APP_IMEETDOMAIN}/#/meetForm?thisPersonName=${
    
    thisName}`
          setTimeout(() => {
    
    
            this.nativeShareFun()
          }, 100)
        } else {
    
    
          this.nativeShareFun()
        }
      })
    },
    nativeShareFun() {
    
    
      var nativeShare = new NativeShare()
      console.log('----------', nativeShare)
      var shareData = {
    
    
        title: 'i+',
        desc: '诚邀您!',
        icon: 'https://www.baidu.com/M.png',
        link: this.shareUrlLink,
        // 不要过于依赖以下两个回调,很多浏览器是不支持的
        success: function success() {
    
    
          console.log('--success---')
        },
        fail: function fail() {
    
    
          console.log('--fail---')
          this.sharePopupShow = true
        }
      }
      console.log('-----调起分享link数据', this.shareUrlLink)
      nativeShare.setShareData(shareData)
      try {
    
    
        console.log('准备进入call方法')
        nativeShare.call()
        console.log('调起call')
      } catch (err) {
    
    
        // 如果不支持,你可以在这里做降级处理
        // alert("当前游览器不支持");
        console.log('未成功调起call')
        this.sharePopupShow = true
      }
    },
    reload() {
    
    
      console.log('11#')
      this.fetchQRCode()
    },
    // 未调起微信分享面板,则进行链接复制,然后唤醒微信
    copy_url(value) {
    
    
      var textarea = document.createElement('textarea')
      var currentFocus = document.activeElement
      document.body.appendChild(textarea)
      textarea.value = value
      textarea.focus()
      if (textarea.setSelectionRange) {
    
    
        textarea.setSelectionRange(0, textarea.value.length)
      } else {
    
    
        textarea.select()
      }
      try {
    
    
        var state = document.execCommand('copy')
      } catch (err) {
    
    
        state = false
      }
      document.body.removeChild(textarea)
      currentFocus.focus() //大佬原版存在聚焦方法,不知其意,注之仍行
      // alert(state ? '链接复制成功' : '链接复制失败')
      if (state) return this.$toast('复制成功!')
    },
    shareUrl() {
    
    
      this.copy_url(this.shareUrlLink)
      try {
    
    
        window.top.location.replace('weixin://') // 唤醒微信
        this.sharePopupShow = false
      } catch (err) {
    
    
        // 如果不支持,你可以在这里做降级处理
        alert('您的浏览器不支持该分享功能,请手动复制链接!')
      }
    }
}
		

猜你喜欢

转载自blog.csdn.net/weixin_44072916/article/details/122670342