微信終于發(fā)布了基于云開發(fā)的微信支付贮聂，相比于原來的支付方式，新版的云開發(fā)版支付支持云函數(shù)形式的回調(diào)寨辩。網(wǎng)上查資料后發(fā)現(xiàn)基本沒有詳細(xì)的文章吓懈，我就吃一次螃蟹吧。
在幾天的努力下靡狞，終于調(diào)試成功耻警，目前小程序已上線，需要看效果的識別下面的小程序碼甸怕。
開發(fā)過微信支付的同學(xué)都知道榕栏，文檔坑，代碼坑層出不窮蕾各，寫此文章的目的就是把我遇到的坑給后來人提個(gè)醒（客觀來說比以前的微信支付好調(diào)的多）。
廢話不多說庆揪，正文開始：
1 申請微信商戶號式曲，關(guān)聯(lián)小程序碼。
此步驟沒有什么難度缸榛，有一個(gè)坑是我申請商戶號的時(shí)候因?yàn)闆]有申請下來新的小程序吝羞，所以提供的是一個(gè)舊的appid。當(dāng)我新的小程序認(rèn)證成功后在微信公眾平臺關(guān)聯(lián)商戶號后内颗，調(diào)用統(tǒng)一下單接口一直報(bào)錯(cuò)：“商戶傳入的appid參數(shù)不正確,請聯(lián)系商戶處理”钧排。在log中發(fā)現(xiàn)，統(tǒng)一下單接口返回的appid是我測試小程序的appid均澳，也就是說新的小程序和商戶沒幫成功恨溜，這個(gè)也可以通過云開發(fā)控制臺看出來：
但是郁悶的是改不了符衔。沒辦法，只能重新申請一個(gè)商戶號糟袁。判族。。
2 商戶號和微信公眾平臺關(guān)聯(lián)项戴。
這步?jīng)]什么坑形帮，只要授權(quán)了就可以。
說明：一個(gè)小程序可以綁定多個(gè)商戶號（同一主體周叮，不同主體沒試過）辩撑，只要開發(fā)的時(shí)候?qū)憣托小?br>
3 在云開發(fā)控制臺進(jìn)行微信支付配置
如下圖配置即可，如果運(yùn)氣好仿耽，不會(huì)出現(xiàn)我說的第一個(gè)坑合冀。
如果此步驟沒有配置，則調(diào)用統(tǒng)一下單接口后氓仲，會(huì)提示：受理關(guān)系不存在水慨。這點(diǎn)需要注意，我在這里卡了一下敬扛。
4 寫js端代碼晰洒，作用：整理支付數(shù)據(jù)，調(diào)用支付云函數(shù)
formSubmit: function (e) {
wx.showLoading({
title: '加載中啥箭。谍珊。。',
})
let that = this;
var uuid = util.uuid(16, 16)//調(diào)用自己的uuid函數(shù)
var body = "換成自己的訂單支付內(nèi)容"
wx.cloud.callFunction({
name: "pay",
data: {
body: body,
orderid: "" + uuid,
money: 1,//支付金額
nonceStr:util.uuid(32, 32)//調(diào)用自己的uuid函數(shù)
},
success(res) {
wx.hideLoading({
complete: (res) => {},
})
console.log("提交成功", res.result)
//創(chuàng)建自己的未支付訂單
急侥。砌滞。。
that.pay(res.result)
},
fail(res) {
wx.hideLoading({
complete: (res) => {},
})
console.log("提交失敗", res)
}
})
}
//實(shí)現(xiàn)小程序支付
pay(payData) {
var that = this;
const payment = payData.payment//這里注意坏怪，上一個(gè)函數(shù)的result中直接整合了這里要用的參數(shù)贝润，直接展開即可使用
wx.requestPayment({
...payment, //。铝宵。打掘。是展開變量的語法
success(res) {
console.log('pay success', res)
//跳轉(zhuǎn)到支付成功頁面
},
fail(res) {
console.error('pay fail', res)
//跳轉(zhuǎn)到支付失敗頁面
}
})
}
5 云函數(shù)
const cloud = require('wx-server-sdk')
cloud.init({
env: cloud.DYNAMIC_CURRENT_ENV
})
exports.main = async (event, context) => {
const res = await cloud.cloudPay.unifiedOrder({
"body" : event.body,
"outTradeNo" : event.orderid,
"spbillCreateIp" : "127.0.0.1",
"subMchId" : "*******",//這里要注意：雖然key是子商戶id，實(shí)際上就是普通商戶id
"totalFee" : parseInt(event.money),//第二個(gè)坑：注意必須是數(shù)字鹏秋，如果不是數(shù)字尊蚁，則會(huì)報(bào)錯(cuò)unifiedOrder:fail wx api error: -202
"envId": "****-20**h",//這里是回調(diào)函數(shù)所屬的的云環(huán)境id
"functionName": "payCallBack",//這個(gè)是回調(diào)函數(shù)名
"nonceStr":event.nonceStr,//第三個(gè)坑：官方文檔中相關(guān)云函數(shù)代碼沒有nonceStr和tradeType，測試的時(shí)候會(huì)報(bào)nonceStr不存在的錯(cuò)侣夷，翻看文檔才發(fā)現(xiàn)這個(gè)是必填項(xiàng)横朋，直接粘過來以后還需要加上這兩個(gè)參數(shù)
"tradeType":"JSAPI"
})
return res
}
6 回調(diào)函數(shù)
之前網(wǎng)上的云開發(fā)微信支付都是沒有回調(diào)的，很不方便百拓。
// 云函數(shù)入口文件
const cloud = require('wx-server-sdk')
cloud.init({
// API 調(diào)用都保持和云函數(shù)當(dāng)前所在環(huán)境一致
env: cloud.DYNAMIC_CURRENT_ENV
})
const db = cloud.database()
const _ = db.command;
// 云函數(shù)入口函數(shù)
exports.main = async (event, context) => {
琴锭。晰甚。。//自己的回調(diào)邏輯
return { "errcode": 0 }//第四個(gè)坑：注意祠够，一定要返回這個(gè)對象压汪，否則回調(diào)回一直觸發(fā)。尤其是自己的邏輯復(fù)雜的時(shí)候一定要保證所有case的返回都帶上這個(gè)對象古瓤。
}
至此止剖，微信支付開發(fā)完畢。
我在開發(fā)中遇到的更多的坑都已經(jīng)記錄在easyDemo小程序中落君，希望我的demo能給你easy穿香。我還會(huì)持續(xù)更新easyDemo，歡迎收藏绎速。
