1. 程式人生 > >支付寶小程式開發之與微信小程式不同的地方

支付寶小程式開發之與微信小程式不同的地方

前言:

本文僅彙總微信小程式移植支付寶小程式過程中遇到的一些不同的地方,詳細請參考官方開發文件。

網路請求:

對於網路請求,基本上改動不大,也就支付寶小程式沒有responseType屬性及響應碼欄位改成了status。

使用者授權登入:

1. 登入:

wx.login   ====   my. getAuthCode wx.checkSession  ====  無(需後端介面驗證)

快取:

以常用的 wx.getStorageSync() 為例,先看微信的程式碼:

wx.setStorageSync("id", "1315151")
var id = wx.getStorageSync("id") console.log("id", id)//輸出 id 1315151

但是同樣的程式碼在支付寶小程式中返回的確是不同的結果:

可見支付寶小程式中 wx.getStorageSync() 的使用與微信不同了,結合支付寶小程式開發文件及例項驗證,支付寶小程式同步獲取快取的示例程式碼如下:

my.setStorageSync({ key: "id", data: "1315151" })//也可以用省略寫法  my.setStorageSync("id","1315151")
var res= my.getStorageSync({ key: 'id' })
console.log(
"res", res)//輸出 res{success:true,key:"id",data:"1315151"}  

可見支付寶小程式中同步快取獲取的引數一定是要傳入物件了,這用起來就有點不太習慣了。如果要做微信小程式的移植,那麼就只有搜尋所有 getStorageSync ,然後進行相應的修改了。

當然也可以直接在utils.js中封裝一個公共函式,用來將支付寶小程式同步快取獲取方式直接轉化成微信小程式的呼叫方式。具體程式碼如下:

//app.js
App({
    ...
  getStorageSync:function(key){
    return
my.getStorageSync({ key: key}).data||null }, ... }); //index.js const app = getApp() Page({ ... my.setStorageSync("id","1315151") var id = app.getStorageSync('id') console.log("id", id)//輸出 id 1315151 ... })

只需要保證每個需要獲取同步快取是指令碼中獲取應用例項app,那麼直接全域性搜尋 “my.getStorageSync" 替換為 "app.getStorageSync" ,這樣之前微信小程式複用過來的這塊兒程式碼改動就很小了。

PS:

1.js中引數物件中如果也有獲取同步快取的程式碼,那麼並不能直接引用上邊封裝的函式,只能用原生的方法去寫,或者把封裝的函式放到App外邊,如:

const getStorageSync=function(key) {
  return my.getStorageSync({ key: key }).data || null
}
App({
  ...
  getStorageSync:function(key){
    return getStorageSync(key)
  },
  globalData: {
    userInfo: null,
    globalShareInfo: {
      ...
      path: '/pages/index/index?goods_id=' + getStorageSync("goods_id"),
  ...
  }
});

這樣在app內部都可以呼叫封裝的getStorageSync函數了,但是這個函式還是要放在app內部開發出去給頁面使用的。

2. 其他公共指令碼,如utils.js,不建議因這一個功能引入整個app.js,建議直接使用原生程式碼,如果用的地方多,也可以在utils.js內部封裝:

my.getStorageSync({ key: "token" }).data || ""

小程式喚起支付:

微信:

wx.requestPayment({
  timeStamp: '',
  nonceStr: '',
  package: '',
  signType: 'MD5',
  paySign: '',
  success (res) { },
  fail (res) { }
})

支付寶:

my.tradePay({
  tradeNO: '201711152100110410533667792', // 呼叫統一收單交易建立介面(alipay.trade.create),獲得返回欄位支付寶交易號trade_no
  success: (res) => {
    my.alert({
      content: JSON.stringify(res),
    });
  },
  fail: (res) => {
    my.alert({
      content: JSON.stringify(res),
    });
  }
});