字节抖音小程序,使用 uniapp 调起内置支付
第一步:提交订单
后端通过抖音预下单接口,提交支付订单信息。
预下单接口_小程序_抖音开放平台预下单接口 提交支付订单信息。 ## 使用限制 无 ## 接口说明 预下单接口需要保证同一app_id下每笔订单的out_order_no是唯一的。同一订单(app_id,out_order_no相同)重复请求需要保持请求参数一致,否则接口会报错拦截。沙盒环境使用说明详见担保支付https://developer.open-douyin.com/docs/resource/zh-CN/mini-app/develop/server/ecpay/pay-list/pay后端拿到抖音返回的数据格式是 string ,如果后端转换了数据格式为对象,前端拿到数据还需要拼接成抖音支付需要的 string 格式,其实可以直接返回字符串给前端,前端直接拿来调用支付即可
第二步:调用支付
orderString: "{\"order_token\":\"CgwIARDPKBjKMCABKAESTgpMjyesuDMrdbGEYMdZMJa6lipo/NLLDfJufCDrwNnXUfbIoLoaX/1NKKCzuapPa4p0qj8ogKTO8tRnNoEnxbfVddD6zII4CuekMexkgxoA.W\",\"order_id\":\"7259313669782358306\"}"
调用抖音支付,抖音小程序所需要的 orderInfo 字段必须是 string 类型的数据格式,如上所示。
onShow() {
uni.getProvider({
service: 'payment',
success: function(res) {
uni.setStorageSync('providerpayment', res.provider[0]);
}
});
},
onLoad(option) {
// #ifdef MP-TOUTIAO
if (option.orderString) {
this.opratePay(JSON.parse(option.orderString));
}
// #endif
},
methods: {
opratePay(orderString, orderNo) {
let _this = this;
//支付
uni.requestPayment({
provider: uni.getStorageSync('providerpayment'),
// #ifdef MP-TOUTIAO
orderInfo: orderString,
service: 5,
// #endif
success: function(value) {
console.log('==== uni.requestPayment success', value);
// #ifdef MP-TOUTIAO
let code = value.code
switch (code) {
case 0:
uni.showToast({
title: '支付成功',
icon: 'none'
});
uni.redirectTo({
url: `/pages/webview/webview?url=${getApp().globalData.urlPrefix}/orderdetail&id=${orderNo}`
});
break;
case 1:
uni.navigateBack({
delta: 1
});
uni.showToast({
title: '支付超时',
icon: 'none'
})
break;
case 2:
uni.navigateBack({
delta: 1
});
uni.showToast({
title: '支付失败',
icon: 'none'
})
break;
case 3:
uni.navigateBack({
delta: 1
});
uni.showToast({
title: '支付关闭',
icon: 'none'
})
break;
case 4:
uni.navigateBack({
delta: 1
});
uni.showToast({
title: '支付取消',
icon: 'none'
})
break;
default:
console.log('==== uni.requestPayment success code!=0');
uni.showToast({
title: '支付失败',
icon: 'none'
})
}
// #endif
},
fail: function(err) {
console.log('==== uni.requestPayment err', err);
uni.showToast({
title: '支付失败',
icon: 'none'
})
uni.navigateBack({
delta: 1
});
}
})
},
},
注意点:
1、抖音沙盒小测试支付调用,必须用沙盒版抖音调试才能正常调起,抖音极速版,抖音商店版都无法正常调起
2、uniapp 如何实现抖音交易支付