1. 新建 assets/script/wecaht.share.js

function getScript() {
  return new Promise((resolve, reject) => {

    $.ajax({
      url: 'https://res.wx.qq.com/open/js/jweixin-1.0.0.js',
      dataType: "script",
      cache : true,
    }).done(function() {
      resolve(window.wx)
    })
    .fail(function(error) {
      reject( error );
    });

  })
}

function act() {
  return new Promise((resolve, reject) => {
    // console.log(window.location.href)
    $.ajax({
      url: 'http://wechat.demo.com/token/getWechat',//后台索要的算法签名
      // type: 'get',
      dataType: 'jsonp',
      data: {
        url: encodeURIComponent(window.location.href.split('#')[0]),
      },
    }).done(function(ret) {
      resolve(ret)
    }).fail(function(ret) {
        reject( ret );
      })
  })
}



export function wechatShare(shareDate) {
  return new Promise(async function(resolve, reject) {

    try{
      let isWechat=navigator.userAgent.indexOf('MicroMessenger')>-1 //判断为微信浏览器
      if(!isWechat){
        return resolve('not weichat')
      }
      if(!window.wx){
        await getScript();
      }


      var defaultData = {
        title: `分享的标题`,
        content: `内容`,
        link: `${window.location.href}`,
        logo: `${require('../images/share.png')}`, //分享出来的图片的
        success: function (res) {

        },
      }
      let data = { ...defaultData, ...shareDate }
      let ret = await act()
      wx.config($.extend({
        // debug:1,
        jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline'],
      }, ret))

      wx.ready(function () {
        wx.onMenuShareTimeline({
          title: data.content,
          desc: '',
          link: data.link,
          imgUrl: data.logo,
          dataUrl: '',
          success: data.success,
          cancel: function () {},
        })
        wx.onMenuShareAppMessage({
          title: data.title,
          desc: data.content,
          link: data.link,
          imgUrl: data.logo,
          dataUrl: '',
          success: data.success,
          cancel: function () {},
        })
        wx.onMenuShareQQ({
          title: data.title,
          desc: data.content,
          link: data.link,
          imgUrl: data.logo,
          dataUrl: '',
          success: data.success,
          cancel: function () {},
        })
      })

    }catch(error){
      reject( error );
    }
  })

}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105

1. main.js

import { wechatShare } from 'src/assets/scripts/wechat.share'; //这里我脚手架配置过Alias，没有配过可直接相对路径来寻找
window.wechatShare  = wechatShare 

• 1
• 2

1. 每个组件的调用方法

wechatShare({
    title: '组件的标题',
     content: '内容',
     link: `${window.location.origin}/user/collegeIndex`,
     logo: `${require('src/assets/images/share.png')}`,
    });