【微信小程序】插件開發(fā)功能和小程序基礎(chǔ)庫文檔
【微信小程序】插件開發(fā)功能文檔對(duì)微信小程序開發(fā)者可開發(fā)完整的插件頁面,并具有微信分享、頁面跳轉(zhuǎn)等能力【微信小程序開發(fā)電話】便于插件開發(fā)者在插件內(nèi)提供完整的服務(wù)流程、同時(shí)可便捷地被其他小程序接入使用。
【微信小程序】插件開發(fā)功能文檔:微信小程序定制開發(fā)電話
插件功能頁
插件功能頁從小程序基礎(chǔ)庫版本 2.1.0 開始支持。
插件不能直接調(diào)用 wx.login 等較為敏感的接口。在需要訪問一些敏感接口時(shí),可以使用插件功能頁的方式。使用插件功能頁可以實(shí)現(xiàn)以下這些功能:
獲取用戶信息,包括 openid 和昵稱等(相當(dāng)于 wx.login 和 wx.getUserInfo 的功能)。
支付(相當(dāng)于 wx.requestPayment )。
需要注意的是:插件使用支付功能,需要進(jìn)行額外的權(quán)限申請(qǐng),申請(qǐng)位置位于管理后臺(tái)的“小程序插件 -> 基本設(shè)置 -> 支付能力”設(shè)置項(xiàng)中。另外,無論是否通過申請(qǐng),主體為個(gè)人小程序在使用插件時(shí),都無法正常使用插件里的支付功能。
在具體使用功能頁時(shí),插件可以在插件的自定義組件中放置一個(gè) <functional-page-navigator> 組件,用戶在點(diǎn)擊這個(gè)組件區(qū)域時(shí),可以跳轉(zhuǎn)到一個(gè)固定的頁面,允許用戶執(zhí)行登錄或其他操作。
激活功能頁特性
功能頁是 插件所有者小程序 中的一個(gè)特殊頁面。
插件所有者小程序,指的是與插件 AppID 相同的小程序。例如,“小程序示例”小程序開發(fā)了一個(gè)“小程序示例插件”,無論這個(gè)插件被哪個(gè)小程序使用,這個(gè)插件的插件所有者小程序都是“小程序示例”。
啟用插件功能頁時(shí),需要在插件所有者小程序 app.json 文件中添加 functionalPages 定義段,其值為 true 。
{ "functionalPages": true }
注意,新增或改變這個(gè)字段時(shí),需要這個(gè)小程序發(fā)布新版本,才能在正式環(huán)境中使用插件功能頁。
跳轉(zhuǎn)到功能頁
在插件需要登錄時(shí),可以在插件的自定義組件中放置一個(gè) <functional-page-navigator> 組件。
代碼示例:
<functional-page-navigator name="loginAndGetUserInfo" args="" version="develop" bind:success="loginSuccess"> <button>登錄到插件</button> </functional-page-navigator>
用戶在點(diǎn)擊這個(gè)區(qū)域時(shí),會(huì)自動(dòng)跳轉(zhuǎn)到插件所有者小程序的功能頁。功能頁會(huì)提示用戶進(jìn)行登錄或其他相應(yīng)的操作。操作結(jié)果會(huì)以組件事件的方式返回。
具體用法和支持的功能頁列表詳見 組件說明 。
目前,功能頁的跳轉(zhuǎn)目前不支持在開發(fā)者工具中調(diào)試,請(qǐng)?jiān)谡鏅C(jī)上測(cè)試。
功能頁函數(shù)
在使用支付功能頁時(shí),插件所有者小程序需要提供一個(gè)函數(shù)來響應(yīng)支付請(qǐng)求。這個(gè)響應(yīng)函數(shù)應(yīng)當(dāng)寫在小程序根目錄中的 functional-pages/request-payment.js 文件中,名為 beforeRequestPayment 。如果不提供這段代碼,將通過 fail 事件返回失敗。
注意:功能頁函數(shù)不應(yīng) require 其他非 functional-pages 目錄中的文件,其他非 functional-pages 目錄中的文件也不應(yīng) require 這個(gè)目錄中的文件。這樣的 require 調(diào)用在未來將不被支持。
代碼示例:
// functional-pages/request-payment.js exports.beforeRequestPayment = function(paymentArgs, callback) { paymentArgs // 就是 functional-page-navigator 的 args 屬性中 paymentArgs // 在這里可以執(zhí)行一些支付前的參數(shù)處理邏輯,包括通知后臺(tái)調(diào)用統(tǒng)一下單接口 // 在 callback 中需要返回兩個(gè)參數(shù): err 和 requestPaymentArgs // err 應(yīng)為 null (或者一些失敗信息) // requestPaymentArgs 將被用于調(diào)用 wx.requestPayment callback(null, { // 這里的參數(shù)與 wx.requestPayment 相同,除了 success/fail/complete 不被支持 timeStamp: timeStamp, nonceStr: nonceStr, package: package, signType: signType, paySign: paySign, }) }
這個(gè)目錄和文件應(yīng)當(dāng)被放置在插件所有者小程序代碼中(而非插件代碼中),它是插件所有者小程序的一部分(而非插件的一部分)。 如果需要新增或更改這段代碼,需要發(fā)布插件所有者小程序,才能在正式版中生效;需要重新預(yù)覽插件所有者小程序,才能在開發(fā)版中生效。
Bugs & Tips
Bug:在微信版本 6.6.7 中,功能頁被拉起時(shí)會(huì)觸發(fā) App 的部分生命周期并使得功能頁啟動(dòng)時(shí)間變得比較長(zhǎng)。在后續(xù)的微信版本中這一行為會(huì)發(fā)生變更,使 App 生命周期不再被觸發(fā)。
兼容
小程序的功能不斷的增加,但是舊版本的微信客戶端并不支持新功能,所以在使用這些新能力的時(shí)候需要做兼容。
文檔會(huì)在組件,API等頁面描述中帶上各個(gè)功能所支持的版本號(hào)。
可以通過 wx.getSystemInfo 或者 wx.getSystemInfoSync 獲取到小程序的基礎(chǔ)庫版本號(hào)。
也可以通過 wx.canIUse 詳情 來判斷是否可以在該基礎(chǔ)庫版本下直接使用對(duì)應(yīng)的API或者組件
兼容方式 - 版本比較
微信客戶端和小程序基礎(chǔ)庫的版本號(hào)風(fēng)格為 Major.Minor.Patch(主版本號(hào).次版本號(hào).修訂號(hào))。 開發(fā)者可以根據(jù)版本號(hào)去做兼容,以下為參考代碼:
function compareVersion(v1, v2) { v1 = v1.split('.') v2 = v2.split('.') var len = Math.max(v1.length, v2.length) while (v1.length < len) { v1.push('0') } while (v2.length < len) { v2.push('0') } for (var i = 0; i < len; i++) { var num1 = parseInt(v1[i]) var num2 = parseInt(v2[i]) if (num1 > num2) { return 1 } else if (num1 < num2) { return -1 } } return 0 } compareVersion('1.11.0', '1.9.9') // 1
兼容方式 - 接口
對(duì)于新增的 API,可以用以下代碼來判斷是否支持用戶的手機(jī)。
if (wx.openBluetoothAdapter) { wx.openBluetoothAdapter() } else { // 如果希望用戶在最新版本的客戶端上體驗(yàn)?zāi)男〕绦?,可以這樣子提示 wx.showModal({ title: '提示', content: '當(dāng)前微信版本過低,無法使用該功能,請(qǐng)升級(jí)到最新微信版本后重試。' }) }
兼容方式 - 參數(shù)
對(duì)于 API 的參數(shù)或者返回值有新增的參數(shù),可以判斷用以下代碼判斷。
wx.showModal({ success: function(res) { if (wx.canIUse('showModal.cancel')) { console.log(res.cancel) } } })
兼容方式 - 組件
對(duì)于組件,新增的組件或?qū)傩栽谂f版本上不會(huì)被處理,不過也不會(huì)報(bào)錯(cuò)。如果特殊場(chǎng)景需要對(duì)舊版本做一些降級(jí)處理,可以這樣子做。
Page({ data: { canIUse: wx.canIUse('cover-view') } })
<video controls="{{!canIUse}}"> <cover-view wx:if="{{canIUse}}">play</cover-view> </video>
functional-page-navigator
這個(gè)組件從小程序基礎(chǔ)庫版本 2.1.0 開始支持。
僅在插件的自定義組件中有效,用于跳轉(zhuǎn)到插件功能頁。
屬性名 | 類型 | 默認(rèn)值 | 說明 | 最低版本 |
---|---|---|---|---|
version | String | release | 跳轉(zhuǎn)到的小程序版本,有效值 develop(開發(fā)版),trial(體驗(yàn)版),release(正式版) ,僅在當(dāng)前小程序?yàn)殚_發(fā)版或體驗(yàn)版時(shí)此參數(shù)有效;如果當(dāng)前小程序是體驗(yàn)版或正式版,則打開的小程序必定是正式版 | 2.1.0 |
name | String | 要跳轉(zhuǎn)到的功能頁 | 2.1.0 | |
args | Object | null | 功能頁參數(shù),參數(shù)格式與具體功能頁相關(guān) | 2.1.0 |
bindsuccess | EventHandle | 功能頁返回,且操作成功時(shí)觸發(fā), detail 格式與具體功能頁相關(guān) | 2.1.0 | |
bindfail | EventHandle | 功能頁返回,且操作失敗時(shí)觸發(fā), detail 格式與具體功能頁相關(guān) | 2.1.0 |
name 有效值:
值 | 說明 | 接受的 args | success 返回的 detail | fail 返回的 detail | 最低版本 |
---|---|---|---|---|---|
loginAndGetUserInfo | 獲取用戶信息,對(duì)應(yīng) wx.login 和 wx.getUserInfo | 與 wx.getUserInfo接受的 args 相同(除回調(diào)函數(shù)外) | wx.login 和 wx.getUserInfo 的結(jié)果的并集 | 與 wx.login 或 wx.getUserInfo 相同 | 2.1.0 |
requestPayment | 支付,對(duì)應(yīng) wx.requestPayment | fee 字段,表示需要顯示在頁面中的金額,單位為分; paymentArgs 字段,任意數(shù)據(jù),傳遞給功能頁中的響應(yīng)函數(shù) | 與 wx.requestPayment相同 | 與 wx.requestPayment相同 | 2.1.0 |
示例代碼:
<!-- sample.wxml --> <functional-page-navigator name="loginAndGetUserInfo" bind:success="loginSuccess"> <button>登錄到插件</button> </functional-page-navigator>
// redirect.js navigator.js Component({ methods: { loginSuccess: function(e) { console.log(e.detail.code) // wx.login 的 code console.log(e.detail.userInfo) // wx.getUserInfo 的 userInfo } } })
Tips:
功能頁是插件所有者小程序中的一個(gè)特殊頁面,開發(fā)者不能自定義這個(gè)頁面的外觀。
在功能頁展示時(shí),一些與界面展示相關(guān)的接口將被禁用(接口調(diào)用返回 fail )。
這個(gè)組件本身可以在開發(fā)者工具中使用,但功能頁的跳轉(zhuǎn)目前不支持在開發(fā)者工具中調(diào)試,請(qǐng)?jiān)谡鏅C(jī)上測(cè)試。
掃二維碼手機(jī)查看該文章