小程序之云开发支付实现
小程序之云开发支付实现
官网地址:小程序之支付
支付配置信息
1、小程序的appid
2、微信商户号
3、商品密钥(注意企业级才可以做小程序)
支付步骤
1、发起订单,获取订单号 makeOrder()
2、预支付,获取支付的5个参数 pay()
3、发送支付 wx.requestPayment()
4、更新支付状态 ,未支付改为已支付 updateStatus()
// 支付
payMoney(){
// 1、发起订单 => 获取订单号
wx.cloud.callFunction({
name:'makeOrder',
// 支付对应的购物车商品数据
data:{
// 把对应订单数据传进去
carts:this.data.carts
}
})
// 2、预支付 => 获取支付需要的5个参数
wx.cloud.callFunction({
name:'pay',
data:{
// 当前订单号
order_number
}
})
// 3、发起支付 5个参数
wx.requestPayment({
nonceStr: 'nonceStr',
package: 'package',
signType:'sinType',
paySign: 'paySign',
timeStamp: 'timeStamp',
})
// 4、更新支付状态 => 已支付
wx.cloud.callFunction({
name:'updateStatus',
data:{
// 当前订单号
order_number
}
})
},
发起订单
1、创建云函数 makeOrder(
)
2、创建集合 orders
3、调用 makeOrder
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 数据库 注意这里要绑定 env 才行
const db = cloud.database({
env:'mini-app-5gy03md80c1d80cc'
})
const orders_col = db.collection('orders')
// 云函数入口函数
exports.main = async (event, context) => {
// 1、创建一个随机订单号,组成一个对象
let obj = {
order_number:Date.now(), // 时间戳 保证不一样
carts:event.carts,
status:0 // 0-未支付 1-已支付
}
// 2、添加到orders集合中
let res = await orders_col.add({
data:obj
})
// 注意返回 res 和 订单号
return {
res,
order_number:obj.order_number
}
}
1、发起订单 => 获取订单号
// 1、发起订单 => 获取订单号
let res1 = await wx.cloud.callFunction({
name:'makeOrder',
// 支付对应的购物车商品数据
data:{
// 把对应订单数据传进去
carts:this.data.carts
}
})
console.log('发送订单=',res1);
微信npm 包 tenpay
新建pay 云函数
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 1、引入 tenpay
const tenpay = require('tenpay');
// 2、配置 里面的内容对应修改
const config = {
appid: '公众号ID', // 例如 wx3594fxxxe260cxxxea
mchid: '微信商户号', // 例如 150088080308
partnerKey: '微信支付安全密钥',
// pfx: require('fs').readFileSync('证书文件路径'),
notify_url: '支付回调网址', //例如 http://xxx.xx.xx/orders/notifiy
spbill_create_ip: 'IP地址' //例如 127.0.0.1
};
// 云函数入口函数
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
// 3、初始化
const api = tenpay.init(config);
// 4、获取支付参数
let result = await api.getPayParams({
// out_trade_no: '商户内部订单号',
out_trade_no: event.order_num + '',
body: '这是一次支付',
total_fee: 1,
// openid: '付款用户的openid'
openid: wxContext.OPENID
});
return result
}
2、预支付 => 获取支付需要的5个参数
// 2、预支付 => 获取支付需要的5个参数
let res2 = wx.cloud.callFunction({
name:'pay',
data:{
// 当前订单号
order_number
}
})
console.log('预支付',res2);
封装发起支付函数
/**
* 发起支付
*
*/
export const ml_payment = (pay) =>{
return new Promise((resolve,reject) =>{
wx.requestPayment({
// nonceStr: '',
// package: '',
// paySign: '',
// timeStamp: '',
// signType:'',
// 这里用 ... 把pay展开
...pay,
success:resolve,
fail:reject
})
})
}
3、发起支付 5个参数
import {ml_payment} from '../../utils/asyncWX'
// 3、发起支付 5个参数
// wx.requestPayment({
// nonceStr: 'nonceStr',
// package: 'package',
// signType:'sinType',
// paySign: 'paySign',
// timeStamp: 'timeStamp',
// })
// 用封装的实现支付 把res2生成的5个参数传入进去
await ml_payment(res2.result)
4、更新支付状态 => 已支付
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database({
env:'mini-app-5gy03md80c1d80cc'
})
const orders_col = db.collection('orders')
// 云函数入口函数
exports.main = async (event, context) => {
// 更新状态 status ,注意这里的where是为了更新哪个订单
let res = await orders_col.where({
order_number:event.order_number
}).update({
data:{
status:1
}
})
return res
}
// 4、更新支付状态 => 已支付
let res4 = await wx.cloud.callFunction({
name:'updateStatus',
data:{
// 当前订单号
order_number
}
})
console.log('更新状态',res4);
5、清空购物车(清空carts里面的数据)
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 数据库
const db = cloud.database({
env:'mini-app-5gy03md80c1d80cc'
})
const carts_col = db.collection('carts')
// 云函数入口函数
exports.main = async (event, context) => {
// 清空购物车
let res = await carts_col.where({
selected:true
}).remove()
return res
}
// 5、清空购物车
let res5 = wx.cloud.callFunction({
name:'clearCarts'
})
console.log("清空购物车",res5);
this.setData({
// 注意 购物车选中的才能删除 一般情况会有选中按钮
carts:[],
totalCount:0,
totalPrice:0
})
carts中最终的代码部分
// miniprogram/pages/cart/cart.js
const db = wx.cloud.database()
const carts_col = db.collection('cart')
import {ml_payment} from '../../utils/asyncWX'
Page({
/**
* 页面的初始数据
*/
data: {
carts:[], // 购物车数据
totalCount:0, // 总数量
totalPrice:0, // 总价格
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.loadCartData()
},
async loadCartData(){
let res = await carts_col.get()
console.log(res);
this.setData({
carts:res.data
})
// 统计总价格和总数量
this.setCart(res.data)
},
setCart(carts){
let totalCount = 0
let totalPrice = 0
carts.forEach(v=>{
totalCount += v.num
totalPrice +=v.num*v.count
})
this.setData({
totalCount:totalCount,
totalPrice:totalPrice,
})
},
// 点击加 1
async addCount(e){
// 1、获取id
let id = e.currentTarget.dataset.id
console.log(id);
// 2、修改num
let res = await carts_col.doc(id).update({
data:{
num:db.command.inc(1)
}
})
// 3、+1成功后 再次重新刷新
// this.loadCartData()
// 3.1、+1 成功后,修改当前data里面的carts数据
let newCart = this.data.carts
console.log(newCart);
let goods = newCart.find(v=>{
return v._id == id
})
console.log(goods);
goods.num +=1
this.setData({
carts: newCart
})
// 4、再次统计
this.setCart(newCart)
},
// 点击减 1
async subtractCount(e){
// 1、获取id
let id = e.currentTarget.dataset.id
// 2、修改num -1
let res = await carts_col.doc(id).update({
data:{
num:db.command.inc(-1)
}
})
// 3、-1成功后 再次重新刷新
// this.loadCartData()
// 3.1、-1成功后,修改当前data里面的carts数据
let newCart = this.data.carts
console.log(newCart);
let goods = newCart.find(v=>{
return v._id == id
})
console.log(goods);
goods.num -=1
// 判断为1时,数量不能少于1
if(goods.num <= 1) goods.num = 1
this.setData({
carts: newCart
})
// 4、再次统计
this.setCart(newCart)
},
/**
* 点击 当前页面对应的tab 钩子函数
*
* */
onTabItemTap(){
wx.setTabBarBadge({
index: 1,
text: '',
})
},
// 支付
async payMoney(){
// 1、发起订单 => 获取订单号
let res1 = await wx.cloud.callFunction({
name:'makeOrder',
// 支付对应的购物车商品数据
data:{
// 把对应订单数据传进去
carts:this.data.carts
}
})
console.log('发送订单=',res1);
// 2、预支付 => 获取支付需要的5个参数
let res2 = wx.cloud.callFunction({
name:'pay',
data:{
// 当前订单号
order_number
}
})
console.log('预支付',res2);
// 3、发起支付 5个参数
// wx.requestPayment({
// nonceStr: 'nonceStr',
// package: 'package',
// signType:'sinType',
// paySign: 'paySign',
// timeStamp: 'timeStamp',
// })
// 用封装的实现支付 把res2生成的5个参数传入进去
await ml_payment(res2.result)
// 4、更新支付状态 => 已支付
let res4 = await wx.cloud.callFunction({
name:'updateStatus',
data:{
// 当前订单号
order_number
}
})
console.log('更新状态',res4);
// 5、清空购物车
let res5 = wx.cloud.callFunction({
name:'clearCarts'
})
console.log("清空购物车",res5);
this.setData({
// 注意 购物车选中的才能删除 一般情况会有选中按钮
carts:[],
totalCount:0,
totalPrice:0
})
// 跳转到订单页面
wx.navigateTo({
url: '/pages/index/index',
})
},
})