小程序開發實戰：支付寶小程序開發踩坑記錄

發表時(shí)間：2021-1-6

發布人(rén)：融晨科技

浏覽次數：70

最近公司業務需求入坑支付寶小程序，本人(rén)自以(yǐ)爲(wéi / wèi)有微信小程序開發的(de)經驗會很簡單，結果還是(shì)中了(le／liǎo)支付寶的(de)坑，由于(yú)百度上(shàng)對于(yú)支付寶小程序的(de)教程少之(zhī)又少，開發過程中遇到(dào)的(de)問題都是(shì)在(zài)釘釘群和(hé / huò)與技術客服咨詢，而(ér)大(dà)多數回答都是(shì)抱歉暫時(shí)沒有，暫時(shí)沒開發。小程序copy的(de)不(bù)咋樣，審核那是(shì)真特麽的(de)嚴，第一版審核8次才過審核，下面是(shì)自己的(de)脫坑記錄。

代碼轉移
這(zhè)個(gè)沒多大(dà)區别，把微信小程序代碼複制過來(lái)，隻需要(yào / yāo)把文件名wxml->axml,wxss->acss，js中的(de)大(dà)多數api名稱把wx.XXX改爲(wéi / wèi)my.XXX，但是(shì)有些微信裏的(de)api支付寶還沒有需要(yào / yāo)自己比較，axml頁面全局替換wx->a 例如wx:if -> a:if，還有事件支付寶以(yǐ)onTap駝峰命名，微信是(shì)bindtap 隻需要(yào / yāo)改這(zhè)幾點即可。
編輯器
這(zhè)第一點記憶猶新，根據官方文檔下載了(le／liǎo)個(gè)0.28.xx(記不(bù)清了(le／liǎo))的(de)穩定版編輯器，然後創建了(le／liǎo)兩個(gè)官方的(de)demo，編輯器上(shàng)沒有任何事情，預覽和(hé / huò)真機調試的(de)時(shí)候手機上(shàng)就(jiù)一直是(shì)加載中，報一堆node.js的(de)錯，然後自己創了(le／liǎo)個(gè)空白的(de)demo也(yě)是(shì)同樣的(de)，以(yǐ)爲(wéi / wèi)是(shì)mac原因在(zài)windows上(shàng)試了(le／liǎo)下也(yě)一樣，咨詢了(le／liǎo)阿裏的(de)技術客服，建議是(shì)升級下編輯器試試，于(yú)是(shì)我升級了(le／liǎo)個(gè)嘗鮮版成功解決（不(bù)過想吐槽這(zhè)bug怎麽稱爲(wéi / wèi)穩定版的(de)）。
用戶登錄
總感覺小程序的(de)開發文檔很是(shì)隐蔽，還是(shì)在(zài)開發文檔中搜索“用戶授權”才找到(dào)的(de)文檔，發現還是(shì)不(bù)在(zài)開發文檔中，然後百度了(le／liǎo)下支付寶小程序用戶登錄就(jiù)是(shì)螞蟻金服開發文檔中的(de)支付寶會員授權信息查詢接口

官方返回的(de)用戶信息爲(wéi / wèi)大(dà)坑中的(de)大(dà)坑

如果你們用戶授權出(chū)現報錯，可以(yǐ)看一下官方有沒有返回給你用戶的(de)昵稱頭像之(zhī)類的(de)，我碰到(dào)的(de)是(shì)用戶沒有此信息連下标都不(bù)給返回寫的(de)代碼就(jiù)直接報錯了(le／liǎo)，正常應該是(shì)沒有數據返回個(gè)空，這(zhè)就(jiù)很難受，後來(lái)發版審核不(bù)過就(jiù)因爲(wéi / wèi)頭像昵稱改了(le／liǎo)，審核員的(de)賬号性别沒設置就(jiù)一直出(chū)錯。

地(dì / de)址選擇（自定義組件通信問題）
微信小程序有官方picker中mode提供了(le／liǎo)省-市-縣三級聯動選擇功能，而(ér)支付寶提供了(le／liǎo)my.multiLevelSelect的(de)級連選擇api，但是(shì)沒有地(dì / de)址表還得再找，由于(yú)懶得找還得寫接口我前端搞了(le／liǎo)個(gè)自定義地(dì / de)址選擇組件，到(dào)最後一步的(de)時(shí)候發現父子(zǐ)組件不(bù)能通信。。黑人(rén)問号臉，以(yǐ)爲(wéi / wèi)自己沒找到(dào)正确的(de)辦法，咨詢了(le／liǎo)技術客服确實是(shì)他(tā)們沒做這(zhè)功能。。。隻能頁面調用組件裏的(de)方法，反之(zhī)不(bù)可。

自定義tabBar
業務功能tabBar裏有個(gè)掃一掃，咨詢官方回複：暫時(shí)不(bù)支持自定義tabBar，然後找UI把掃一掃調到(dào)頁面了(le／liǎo)。

生命周期坑
tabBar上(shàng)的(de)兩個(gè)頁面來(lái)回切換onShow隻加載一次，跳轉其他(tā)頁面再回來(lái)onShow正常展示。

客服
支付寶也(yě)提供了(le／liǎo)一鍵客服功能

<view class='kfBox'>
    <contact-button tnt-inst-id="企業編碼" scene="聊天窗編碼" size="35" color="#00A3FF" icon="/images/wd-ico06.png" />
    <!-- <text class='kfText'>客服與幫助</text> -->
</view>

該标簽不(bù)能包含文字，也(yě)不(bù)能定義文字，隻能自定義圖片。（有一次審核被駁回就(jiù)是(shì)因爲(wéi / wèi)審核員說(shuō)點擊文字不(bù)能打開客服，我特麽你們組件不(bù)能定義文字，我給個(gè)提示說(shuō)點不(bù)動，然後就(jiù)把文字去掉了(le／liǎo)，标簽客服圖标放大(dà)）

審核
述說(shuō)幾次被駁回的(de)記錄，吐槽下支付寶審核惡心的(de)地(dì / de)方，一是(shì)非常的(de)嚴，二是(shì)遇見不(bù)符合的(de)就(jiù)駁回，絕對不(bù)會給你往下多看幾個(gè)問題讓你一次改，來(lái)來(lái)回回的(de)非常浪費時(shí)間！！
1.支付寶不(bù)允許打開小程序就(jiù)有授權彈框的(de)功能，這(zhè)點和(hé / huò)微信一樣。但是(shì)官方給的(de)demo就(jiù)是(shì)打開先授權，這(zhè)點就(jiù)誤導我以(yǐ)爲(wéi / wèi)支付寶允許。
微信獲取code和(hé / huò)授權是(shì)分爲(wéi / wèi)兩個(gè)方法，而(ér)支付寶都整合在(zài)my.getAuthCode這(zhè)個(gè)api了(le／liǎo)，控制my.getAuthCode用戶授權框的(de)是(shì)scopes參數，這(zhè)個(gè)參數不(bù)是(shì)必填的(de)，但是(shì)當該參數爲(wéi / wèi)auth_user（主動授權） / auth_zhima（芝麻信用）的(de)時(shí)候授權框才會彈出(chū)。
首次用戶獲取code去後台判斷用戶是(shì)否存在(zài)的(de)時(shí)候可以(yǐ)把這(zhè)參數去掉，就(jiù)不(bù)會直接彈出(chū)授權框了(le／liǎo)。
還有一點需要(yào / yāo)說(shuō)明，支付寶小程序的(de)授權框可以(yǐ)不(bù)用button激活，就(jiù)是(shì)說(shuō)寫個(gè)公共授權的(de)方法，判斷用戶沒授權就(jiù)直接調用該方法就(jiù)能彈出(chū)授權框了(le／liǎo)。
2.支付寶審核非常的(de)嚴格，每個(gè)頁面的(de)功能都要(yào / yāo)點擊，我有個(gè)回首頁的(de)按鈕事件忘記調回來(lái)就(jiù)給駁回了(le／liǎo)。
3.沒做完的(de)功能或者不(bù)完整的(de)别上(shàng)架審核，因爲(wéi / wèi)地(dì / de)址選擇的(de)問題沒做完，我想先發一版測試一下掃一掃的(de)功能，結果駁回内容是(shì)地(dì / de)址不(bù)能添加。要(yào / yāo)是(shì)在(zài)微信很多時(shí)候就(jiù)直接給過了(le／liǎo)。
4.我們的(de)産品是(shì)線上(shàng)線下結合的(de)，因爲(wéi / wèi)掃一掃的(de)功能，支付寶讓錄個(gè)視頻給審核，但是(shì)線下的(de)機器還沒連調成功沒辦法模拟了(le／liǎo)個(gè)假視頻的(de)給上(shàng)傳的(de)。（這(zhè)一點感覺很膈應，我做的(de)是(shì)小程序功能不(bù)對不(bù)給過就(jiù)算了(le／liǎo)，線下的(de)機器也(yě)要(yào / yāo)看一眼就(jiù)有點煩了(le／liǎo)，微信我發了(le／liǎo)二十多小版本毛事沒有）
5.敏感詞彙。最後一次審核把bug都調完了(le／liǎo)，小程序由于(yú)是(shì)重微信小程序直接轉回來(lái)的(de)，介紹裏面有幾個(gè)微信的(de)詞語，所以(yǐ)給駁回了(le／liǎo)讓删除，這(zhè)一個(gè)點又耽誤了(le／liǎo)一天審核。