微信小程序API轉發,小程序顯示當前頁面的轉發按鈕
onShareAppMessage(options)
在 Page 中定義 onShareAppMessage 函數,設置該頁面的轉發信息。
- 只有定義了此事件處理函數,右上角菜單才會顯示“轉發”按鈕
- 用戶點擊轉發按鈕的時候會調用
- 此事件需要 return 一個 Object,用于自定義轉發內容
options 參數說明
參數 | 類型 | 說明 | 最低版本 |
---|---|---|---|
from | String | 轉發事件來源。button:頁面內轉發按鈕;menu:右上角轉發菜單 | 1.2.4 |
target | Object | 如果 from 值是 button,則 target 是觸發這次轉發事件的 button,否則為 undefined | 1.2.4 |
字段 | 說明 | 默認值 | 最低版本 |
---|---|---|---|
title | 轉發標題 | 當前小程序名稱 | |
path | 轉發路徑 | 當前頁面 path ,必須是以 / 開頭的完整路徑 | |
success | 轉發成功的回調函數 | 1.1.0 | |
fail | 轉發失敗的回調函數 | 1.1.0 | |
complete | 轉發結束的回調函數(轉發成功、失敗都會執行 | 1.1.0 |
回調結果:
回調類型 | errMsg | 說明 |
---|---|---|
success | shareAppMessage:ok | 轉發成功 |
fail | shareAppMessage:fail cancel | 用戶取消轉發 |
fail | shareAppMessage:fail (detail message) | 轉發失敗,其中 detail message 為詳細失敗信息 |
success回調參數說明:
參數 | 類型 | 說明 | 最低版本 |
---|---|---|---|
shareTickets | StringArray | shareTicket 數組,每一項是一個 shareTicket ,對應一個轉發對象 | 1.1.0 |
示例代碼:
Page({
onShareAppMessage: function (res) {
if (res.from === 'button') {
// 來自頁面內轉發按鈕
console.log(res.target)
}
return {
title: '自定義轉發標題',
path: '/page/user?id=123',
success: function(res) {
// 轉發成功
},
fail: function(res) {
// 轉發失敗
}
}
}
})
wx.showShareMenu(OBJECT)
基礎庫版本 1.1.0 開始支持,低版本需做兼容處理
顯示當前頁面的轉發按鈕
OBJECT參數說明:
參數 | 類型 | 必填 | 說明 |
---|---|---|---|
withShareTicket | Boolean | 否 | 是否使用帶 shareTicket 的轉發詳情 |
success | Function | 否 | 接口調用成功的回調函數 |
fail | Function | 否 | 接口調用失敗的回調函數 |
complete | Function | 否 | 接口調用結束的回調函數(調用成功、失敗都會執行) |
示例代碼:
wx.showShareMenu({
withShareTicket: true
})
wx.hideShareMenu(OBJECT)
基礎庫版本 1.1.0 開始支持,低版本需做兼容處理
隱藏轉發按鈕
OBJECT參數說明:
參數 | 類型 | 必填 | 說明 |
---|---|---|---|
success | Function | 否 | 接口調用成功的回調函數 |
fail | Function | 否 | 接口調用失敗的回調函數 |
complete | Function | 否 | 接口調用結束的回調函數(調用成功、失敗都會執行) |
示例代碼:
wx.hideShareMenu()
wx.updateShareMenu(OBJECT)
基礎庫 1.2.0 開始支持,低版本需做兼容處理
更新轉發屬性
OBJECT參數說明:
參數 | 類型 | 必填 | 說明 |
---|---|---|---|
withShareTicket | Boolean | 否 | 是否使用帶 shareTicket 的轉發詳情 |
success | Function | 否 | 接口調用成功的回調函數 |
fail | Function | 否 | 接口調用失敗的回調函數 |
complete | Function | 否 | 接口調用結束的回調函數(調用成功、失敗都會執行) |
示例代碼:
wx.updateShareMenu({
withShareTicket: true,
success() {
}
})
wx.getShareInfo(OBJECT)
基礎庫 1.1.0 開始支持,低版本需做兼容處理
獲取轉發詳細信息
OBJECT參數說明:
參數 | 類型 | 必填 | 說明 |
---|---|---|---|
shareTicket | String | 是 | shareTicket |
success | Function | 否 | 接口調用成功的回調函數 |
fail | Function | 否 | 接口調用失敗的回調函數 |
complete | Function | 否 | 接口調用結束的回調函數(調用成功、失敗都會執行) |
CALLBACK 參數說明:
參數 | 類型 | 說明 |
---|---|---|
errMsg | String | 錯誤信息 |
encryptedData | String | 包括敏感數據在內的完整轉發信息的加密數據,詳細見加密數據解密算法 |
iv | String | 加密算法的初始向量,詳細見加密數據解密算法 |
encryptedData 解密后為一個 JSON 結構,包含字段如下:
字段 | 說明 |
---|---|
openGId | 群對當前小程序的唯一 ID |
Tip: 如需要展示群名稱,可以使用開放數據組件
獲取更多轉發信息
通常開發者希望轉發出去的小程序被二次打開的時候能夠獲取到一些信息,例如群的標識。現在通過調用 wx.showShareMenu
并且設置 withShareTicket
為 true
,當用戶將小程序轉發到任一群聊之后,可以獲取到此次轉發的 shareTicket
,此轉發卡片在群聊中被其他用戶打開時,可以在 App.onLaunch() 或 App.onShow 獲取到另一個 shareTicket
。這兩步獲取到的 shareTicket
均可通過 wx.getShareInfo() 接口可以獲取到相同的轉發信息。
頁面內發起轉發
基礎庫 1.2.0 開始支持,低版本需做兼容處理
通過給 button
組件設置屬性 open-type="share"
,可以在用戶點擊按鈕后觸發 Page.onShareAppMessage()
事件,如果當前頁面沒有定義此事件,則點擊后無效果。相關組件:button
使用指引
轉發按鈕,旨在幫助用戶更流暢地與好友分享內容和服務。轉發,應是用戶自發的行為,且在需要時觸手可及。開發者在使用時若遵從以下指引,會得到更佳的用戶體驗。
- 含義清晰:明確、一目了然的圖形按鈕,將為用戶減少理解的時間。在我們的資源下載中心,你可以找到這樣的按鈕素材并直接使用。或者你可以根據自己業務的設計風格,靈活設計含義清晰的按鈕的樣式。當然,你也可以直接使用帶文案的按鈕,“轉發給好友”,它也足夠明確。
- 方便點擊:按鈕點擊熱區不宜過小,亦不宜過大。同時,轉發按鈕與其他按鈕一樣,熱區也不宜過密,以免用戶誤操作。
- 按需出現:并非所有頁面都適合放置轉發按鈕,涉及用戶隱私的非公開內容,或可能打斷用戶完成當前操作體驗的場景,該功能并不推薦使用。同時,由于轉發過程中,我們將截取用戶屏幕圖像作為配圖,因此,需要注意幫助用戶屏蔽個人信息。
- 尊重意愿:理所當然,并非所有的用戶,都喜歡與朋友分享你的小程序。因此,它不應該成為一個誘導或強制行為,如轉發后才能解鎖某項功能等。請注意,這類做法不僅不被推薦,還可能違反我們的《運營規范》,我們強烈建議你在使用前閱讀這部分內容。
以上,我們陳列了最重要的幾點,如果你有時間,可以完整瀏覽《設計指南》,相信會有更多的收獲。
Bug & Tip
-
tip
: 轉發圖片不能自定義;會取當前頁面,從頂部開始,高度為 80% 屏幕寬度的圖像作為轉發圖片。 -
tip
: 轉發的調試支持請查看 普通轉發的調試支持 和 帶 shareTicket 的轉發 -
tip
: 只有轉發到群聊中打開才可以獲取到shareTickets
返回值,單聊沒有shareTickets
-
tip
:shareTicket
僅在當前小程序生命周期內有效 -
tip
: 由于策略變動,小程序群相關能力進行調整,開發者可先使用wx.getShareInfo
接口中的群ID進行功能開發。
更多微信小程序開發教程,可以關注hi小程序。
第二部分:如何開通一個小商店