uniapp开发app项目对接微信、支付宝支付

七巷老街

已于 2022-07-18 17:05:12 修改

阅读量2.1k

点赞数

文章标签：小程序前端

于 2022-07-18 16:59:30 首次发布

本文链接：https://blog.csdn.net/m0_59256433/article/details/125855307

版权

本文介绍了在uni-app中进行支付功能的配置和实现，包括在manifest.json中设置支付权限和选择支付平台，以及使用uni.requestPayment调用微信和支付宝API进行支付操作的详细步骤，并展示了支付成功和失败的回调处理。

摘要由CSDN通过智能技术生成

1.在manifest.json - App模块权限选择中勾选 payment(支付)

2.在 manifest.json - App SDK配置中，勾选需要的支付平台

async submitForm() {
                // 调用后端接口 获取到支付需要的订单参数 appid、noncestr、package、partnerid、prepayid、timestamp、sign
				let params = {
					type: this.type, // 用来告诉后端用的是哪一种支付方式
					id: this.prid // 需要支付的商品标识
				}
				let { data } = await this.$http.post('api/rechargePay', params);
				console.log(data) // 得到订单参数
				if (this.type == 2) {
                    // 调用uni.requestPayment({})  
					uni.requestPayment({
						provider: 'wxpay', // 服务提供商 wxpay 微信 alipay 支付宝
						orderInfo: data.data, // 支付订单参数
						success: function(res) { // 成功的回调
							uni.showToast({
								icon: 'success',
								title: '支付成功'
							})
						},
						fail: function(err) { // 失败的回调
							console.log(err);
							return false;
						},
					});
				} else if (this.type == 1) { 
					uni.requestPayment({
						provider: 'alipay', //服务提供商（支付宝）（服务提供商，通过uni.getProvider获取）
						orderInfo: data.data,
						success(res) {
							uni.showToast({
								icon: 'success',
								title: '支付成功'
							})
						},
						fail(err) {
							uni.showToast({
								title: '支付失败',
								icon: 'none'
							})
						}
					});
				}
			},