background

  • vue-cli3
  • WeChatVersion 7.0.9

1, the pitsdkThe introduction of

  • How to introduce weixin-js-SDK in VUE

  • The official making

    Official note:

Official statement says it doesn’t work

Correct usage:

        const wx = window.jWeixin || require('weixin-js-sdk')//window. JWeixin
Copy the code

2, pit of two signature error

  • Wx. config message invalid signature error.

    The SDK documentation

The following appInfo is the data for the back end. An interface like getmpJS

Pay attention to thisurlParameter, requiredencodeURIComponentCode, otherwise it will report a signature error

wx.config({ // Set wechat parameters
          debug: false.appId: appInfo.appId,// Mandatory, the unique identifier of the public account
          timestamp: appInfo.timestamp, // Mandatory to generate the timestamp of the signature
          nonceStr: appInfo.nonceStr,// Mandatory to generate a random string of signatures
          signature: appInfo.signature,// Mandatory, signature
          jsApiList: ["onMenuShareAppMessage"."onMenuShareTimeline"]// The method used here is a mandatory list of JS interfaces to use
        })
Copy the code

Why do YOU encode urls? reference

3. Pit # 3 — Sharing with friends doesn’t work

  • The new one cannot be used. Please use a deprecated method. Ah… The measured. Use something that’s going to be obsolete.
// Share with friends -- old version
          wx.onMenuShareAppMessage({
            title: fnProductObj.name, // Share the title
            desc: fnProductObj.reason, // Share the description
            link: window.location.href, // Share link, the link domain name or path must be the same as the current page corresponding public number JS security domain name
            imgUrl: `${_this.$path}${fnProductObj.detailimg_url}`.// Share ICONS
            success:(a)= > {
              //alert(' share to friends successfully ')
              // The setting succeeded}})Copy the code