SoFunction
Updated on 2025-04-07

Example of WeChat sharing function implemented in vue project

This article describes the WeChat sharing function implemented in the vue project. Share it for your reference, as follows:

/* WeChat Share */
 = (shareData) => {
 let resource = {
  title: 'As my wish!  ',
  desc: 'Experience quality service',
  link: '/',
  img: '/images/share_logo.jpg'
 }
 let obj = ({}, resource, shareData)
 let params = {url: }
 $post('/vue/weixinjiekou', params).then(data => {
  // Share the title and other parameters  const shareTitle = 
  const shareDesc = 
  const shareLink =  ?  +  : 
  const shareImgUrl = 
  const config = {
   title: shareTitle, // Share the title   desc: shareDesc, // Share the description   link: shareLink, // Share link   imgUrl: shareImgUrl, // Share icon   type: '', // Sharing type, music, video or link, if not filled in, the default is link   dataUrl: '', // If the type is music or video, you want to provide a data link, the default is empty   success: function () {},
   cancel: function () {}
  }
  ({
   debug: false,
   appId: , // The same as the one who obtains Tickke------------------------------------------------------------------------------------------------------------------   timestamp: , // Required to generate a signature time stamp   nonceStr: , // Required to generate a random string of signatures   signature: , // Required, signature, see Appendix 1   // List items that need to be shared: Send to friends, share to friends, share to QQ, share to QQ space   jsApiList: [
    'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo',
    'onMenuShareQZone', 'startRecord', 'stopRecord', 'onVoiceRecordEnd', 'playVoice',
    'pauseVoice', 'stopVoice', 'onVoicePlayEnd', 'uploadVoice', 'downloadVoice',
    'chooseImage', 'previewImage', 'uploadImage', 'downloadImage', 'translateVoice',
    'getNetworkType', 'openLocation', 'getLocation', 'hideOptionMenu', 'showOptionMenu',
    'hideMenuItems', 'showMenuItems', 'hideAllNonBaseMenuItem', 'showAllNonBaseMenuItem',
    'closeWindow', 'scanQRCode', 'chooseWXPay', 'openProductSpecificView', 'addCard',
    'chooseCard', 'openCard'
   ]
  })
  // Process the information of verification failure  (function (res) {
   ('The information returned by the verification failed:', res)
  })
  // Process the information that the verification is successful  (function () {
   // Share with friends   (config)
   // Share to friends   (config)
   // Share to qq   (config)
   // Share on Weibo   (config)
   // Share to QQ space   (config)
  })
 })
}

WeChat interface information

{
 "result": {
  "appid": "appid",
  "noncestr": "Random String",
  "signature": "sign",
  "timestamp": Timestamp,
  "flag": 6
 },
 "status": "y"
}

I hope this article will be helpful to everyone's programming.