uniapp實現支付功能

直接貼代碼

//支付寶支付
	zfbPay(){
		uni.getProvider({  //獲取可用的支付環境
			service: 'payment',
			success: res=>{
				if (~res.provider.indexOf('alipay')) { //先判斷用戶是否有支付寶支付環境
					uni.showLoading({title: '正在調起支付寶支付'})
					let params={  //給后端傳什么參數看你的后端需要什么
						money:this.moneyCount,
						ispc:3
					}
					uni.request({  //再從后端接口獲取相關數據配置到orderInfo里，這個接口由后端配置好了，返回結果見下圖1-支付寶
						url: `${this.$baseUrl}/api-order/amstc/userRechargeAccountByAliPay`,
						method: 'POST',
						header: {
							"Token":this.userToken,
							"Content-Type":"application/x-www-form-urlencoded"
						},
						data: params,
						success: res => {
							if(res.data.code==200){
								let payInfo=res.data.data  //拿到后端返回數據后調用下面支付函數（若接口返回obj,需先轉成string類型）
								uni.requestPayment({
									provider: 'alipay',
									orderInfo: payInfo, //支付寶訂單數據（string類型）
									success: res=>{
										uni.hideLoading();
										uni.showToast({title: '支付成功',icon:'none'})
									},
									fail:err=>{
										uni.hideLoading();
										uni.showToast({title: '支付失敗，請稍后再試',icon:'none'})
									}
								});
							}
						},
						fail: () => {
							uni.hideLoading();
							uni.showToast({title: '服務器開小差了呢，請您稍后再試',icon:'none'})
						}
					});
				}else{
					uni.showToast({title: '獲取支付寶通道失敗，請檢查您的支付寶是否正常啟用',icon:'none'})
				}
			}
		});
	},

//微信支付
	wxPay(){
		uni.getProvider({
			service: 'payment',
			success: res=>{
				if (~res.provider.indexOf('wxpay')) { //先判斷用戶是否有微信支付環境（是否安裝了微信app）
					uni.showLoading({title: '正在調起微信支付'})
						let params={
							money:this.moneyCount,
							bs:4
						}
						uni.request({  //再從后端接口獲取相關數據配置到orderInfo里，這個接口由后端配置好了，返回結果見下圖2-微信
							url: `${this.$baseUrl}/api-order/amstc/userRechargeAccountByWx`,
							method: 'POST',
							header: {
								"Token":this.userToken,
								"Content-Type":"application/x-www-form-urlencoded"
							},
							data: params,
							success: res => {
								if(res.data.code==200){
									let resobj=JSON.parse(res.data.data)  //（這里注意后端返回的數據類型是string還是object，需轉成object類型）
									let payInfo={
										appid: resobj.appid,
										noncestr: resobj.nonce_str,
										package:"Sign=WXPay",
										partnerid: resobj.mch_id,
										prepayid: resobj.prepay_id,
										timestamp: resobj.time_stamp,
										sign: resobj.sign,
									}
									uni.requestPayment({
										provider: 'wxpay',
										orderInfo: payInfo, //微信訂單數據（Object類型）
										success: res=>{
											uni.hideLoading();
										        uni.showToast({title: '支付成功',icon:'none'})
										},
										fail:err=>{
											uni.hideLoading();
										        uni.showToast({title: '支付失敗，請稍后再試',icon:'none'})
										}
									});
								}
							},
							fail: () => {
								uni.hideLoading();
								uni.showToast({title: '服務器開小差了呢，請您稍后再試',icon:'none'})
							}
						});
					}else{
						uni.showToast({title: '獲取微信通道失敗，請檢查您的微信是否正常啟用',icon:'none'})
					}
				 }
			});
		},

支付寶獲取orderInfo的接口

微信獲取orderInfo的接口