H 5ページの微信側での共有


H 5ページの微信側での共有
微信の共有は、一見複雑そうに見えますが、実はとても簡単です.微信公式の微信jssdkを呼び出すだけで、いくつかの構成を加えると、h 5ページの微信での共有を実現することができます.公式ドキュメントのアドレスは:https://mp.weixin.qq.com/wiki...
一、基本情報の取得
既存の公衆番号のappidを見つけ、このappidとurlに基づいてバックエンドに要求を開始し、構成に必要なパラメータ:timestamp、noncestr、signatureを取得します.
二、実現
1、ページ導入JS-SDKファイル
scriptタグにより、微信公式サイトのJS-SDKファイル
2、
wx.config({
  debug: false, //         
  appId: appid, //appid
  timestamp: timestamp, //    
  nonceStr: noncestr, //      
  signature: signature, //   
  jsApiList: [
    'onMenuShareTimeline',
    'onMenuShareAppMessage',
    'onMenuShareQQ',
    'onMenuShareWeibo',
    'onMenuShareQZone'
  ] //      JS    
})

3、
wx.ready(function(){
  //      
  wx.onMenuShareAppMessage({
    title: title, //     
    desc: desc, //     
    link: link, //     
    imgUrl: imgUrl, //     
    success: function () {
      doShareDone()
    },
    cancel: function () {
      doShareCancel()
    }
  })
  
 //       
  wx.onMenuShareTimeline({
    title: title, //     
    link: link, //     
    imgUrl: imgUrl, //     
    success: function () {
      doShareDone()
    },
    cancel: function () {
      doShareCancel()
    }
  })
})
//       
function doShareDone () {
  console.log('    ')
}
//       
function doShareCancel () {
  console.log('     ')
}

、デバッグ
wx.configのdebugフィールドがtrueに されている 、デバッグできます.
デバッグには、 ツールを して、 のページ を し、ページアドレスを すればいいです.
、 と
JS-SDK ドキュメントの 5には、ほとんどの の があります.ここでは、 が ったいくつかの を げています.
1、Uncaught TypeError: Cannot read property 'config' of undefined
:htmlページにsdkが で され、コンポーネントが されてもsdkが1 され、 が し、そのうちの1つが されます.
2、Uncaught (in promise) TypeError: Cannot read property 'ready' of undefined
: 1.
3、invalid signature
:ドキュメント の がこの を していない は、まず も な を してconfig okにし、それから が とする なパラメータの を して、 を して、 に します. し いにくいかもしれませんが、 に すると、ページにはconfigが した があれば、この のsignatureが であっても、 の を し けることができます.