探秘小程序(10):分享功能+webview


場景:

小程序頁面用webview嵌入了h5頁面,h5頁面需要與小程序進行交互,h5頁面內容不同,分享的鏈接也不一樣

分享功能:

小程序的分享功能即用戶點擊小程序右上角,轉發功能頁面。可以指定分享卡片的標題,分享的圖片,以及用戶點擊分享卡面的后跳轉的地址demo如下所示:

Page({

   onShareAppMessage: function (res) {

     if (res.from === 'button') { // 來自頁面內轉發按鈕

       console.log(res.target)

     } 

    return {

       title: '自定義轉發標題', path: '/page/user?id=123'

     }

   }

})
下面重點來了,踩過的坑了解一下:
onShareAppMessage,方法必須包含return,並且return 有效,何時無效呢?如果將return包裹在setTimeout這樣的異步函數中便無效。

②return中path,必須是小程序的頁面路徑

③path中如果包含了其他參數,而參數中又包含了url鏈接,需要進行encodeURIComponent/decodeURLComponent進行編碼解碼操作

④webview想小程序發送消息時,

  通過h5頁面 通過jssdk的postmessage發送數據:wx.miniProgram.postMessage({ data: 'foo' }),必須有data!!!!!!!

 

  小程序通過bindmessage="XXX"進行獲取數據:回調函數xxx中,通過e.detail.data拿到數據、

⑤:postmessage在分享、推出頁面或者巴拉巴拉的場景下才會執行,那執行的順序如何呢?猜的沒錯是postmessage先執行然后onshareAppMessage方法后執行。可是如果在postmessage中使用setData等異步方法進行賦值操作,share回調方法中可能會拿不到值哦~~~~




免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM