http://luckykun.com/work/2016-05-14/weixin-share.html

最近要慢慢開始做移動端的一些頁面了，並且大多數都是活動頁面，需要在微信裡面分享、傳播。

如果只是單單傳播一下頁面，擴散一些資訊還好，那就跟pc差不多，一刀一刀切頁面就完了。。。但是我們在傳播的時候往往需要分享出去，並且自定義傳播資訊的標題、連結或者圖片，有時候一些小遊戲還需要獲取使用者的資訊等等，那麼，就需要呼叫微信分享的介面了…

我跟著微信官方文件開發了兩次，其實如果搞清楚了流程，本身步驟也還算簡單。但是我發現每次要寫很多重複的程式碼，並且因為時間間隔，每次開發的時候又要重新看看文件，才能回憶起該怎麼呼叫＝＝，所以我寫這個微信分享的小外掛，就是為了自己以後再做這樣的需求時，分分鐘搞定。順便在這裡做一個簡單的記錄，如果文中有錯，歡迎大家指出^_^。

使用條件

首先解釋一下，這裡的使用條件，不是說外掛的使用條件，而是呼叫微信分享介面的使用條件。

不是每個人隨便寫個頁面都能拿到微信裡，互相傳播，讓使用者授權，獲取使用者資訊的。你需要擁有一個已經認證過的微信公眾號，進入”公眾號設定”的”功能設定”裡填寫”JS介面安全域名”，來繫結一個能訪問的域名，另外還需要一個與公眾號對應的唯一的appId，這個id能從公眾號後臺檢視。

呼叫過程

其實使用的過程在微信官方文件中已經說的非常清楚了，但是其中其實有很多的都是我們用不到的，所以我把分享頁面的開發過程再簡單的總結一遍:

• 呼叫後臺介面，獲取簽名信息(服務端提供)。

• 所有需要使用JS-SDK的頁面必須先注入配置資訊，如下配置之後(signature,nonceStr,timestamp就是上一步獲取到的資訊)，方能呼叫分享介面。

  wx.config({ debug: true, //開啟除錯模式，會實時的提示資訊 appId: self.config.appId, // 必填，公眾號的唯一標識 timestamp: d.timestamp, // 必填，生成簽名的時間戳 nonceStr: d.conststr, // 必填，生成簽名的隨機串 signature: d.signature,// 必填，簽名，見附錄1 jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage']});

• 如果上一步的配置有錯，則執行：

  wx.error(function (){ alert('error');})

• 如果配置成功，則執行

  wx.ready(function(){ //...})

• 然後在配置成功的回撥函式裡，即可呼叫分享的函數了。

  wx.ready(function(){ wx.onMenuShareTimeline({ //分享到朋友圈 title: ‘標題’, link: 'http://www.taobao.com', imgUrl: 'imgurl', success: function () { self.config.circleFunction(); // 分享成功的回撥函式 }, cancel: function () { // 取消分享 } }); wx.onMenuShareAppMessage({ //分享給朋友 title: self.config.title, link: self.config.link, desc: '為什麼這裡沒有起作用？？', imgUrl: self.config.imgUrl, success: function () { self.config.friendFunction(); // 分享成功的回撥函式 }, cancel: function () { // 取消分享 } });})

  值得一提的是，這裡用到的函式，都需要在配置項的'jsAplilist'中新增進去。 jsApiList: [‘onMenuShareTimeline’, ‘onMenuShareAppMessage’]

外掛程式碼

說明：

• 因為我最常見的就是分享朋友圈和分享給朋友這兩個需求，所以外掛只是實現了這樣個功能，官方文件中還有其他很多功能強大的介面，比如分享到微博，分享到qq等等，大家如果有需要，可以自行新增。
• 另外，分享給朋友這個介面還有一些配置項因為不常用，也沒有列出來，比如：檔案型別type，檔案連結dataUrl（如果型別為音樂或視訊）。

使用文件

配置項：

• appId： 必填，公眾號的唯一標識。
• url：後端介面地址（不需要配置介面引數，因為外掛已經傳入了需要的引數code、state、url、method）。
• imgUrl：分享出去的圖片地址。
• title：分享出去的標題。
• link：分享出去的連結（注意：如果希望別人點選你分享的連結也需要授權，則需要微信客戶端的連結格式。）
• desc：分享給朋友的的描述資訊。
• circleFunction：分享到朋友圈成功的回撥函式。
• friendFunction：分享給朋友成功的回撥函式。
• callback：引數d(使用者資訊)，介面呼叫成功，處理使用者資訊的回撥函式。

總結

因為平時用到的只有分享朋友圈和朋友這兩個介面，所以這個外掛也只是實現了這兩個功能。並且標題，連結，圖片地址都是公用的。以後如有需要，可以繼續增加功能。