小程序如何做支付功能_小程序测试支付时候怎么修改价格在提交-优快云博客

本文详细介绍了微信小程序中实现支付功能的步骤，包括发送支付金额给后台、接收并处理支付参数、签名验证及调用微信支付接口的过程。文章还提供了具体的代码示例，展示了如何进行MD5加密签名以及如何根据支付结果展示相应页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

			/**
			 * 支付功能：
			 * 
			 * 1、将支付金额发送给后台 后台将支付时需要的参数返回来
			 * 2、发起支付 填上对应的参数（注意：签名需要md5加密）
			 * 3、根据支付结果显示对应的页面
			 * */
			async payment() {
			//this.$ajax 自己封装的网络请求
				let res = await this.$ajax({
					method: "post",
					data: {
						money: 0.01   //支付的金额
					},
					url: `/v1/WxShopcatpay`   //后台接口
				})
				if (res.data.code === "200") {
					console.log(res)
					let data = res.data.data  //后台返回的数据
					//统一下单接口返回的 prepay_id 参数值
					let pkg = 'prepay_id=' + data.prepay_id;  
					//设置时间戳
					let timeStamp = (Date.parse(new Date()) / 1000).toString();
					/**
					 * 设置签名并md5加密
					 * 
					 * 参数：
					 * appId 小程序唯一标识 （后台返回）
					 * nonceStr 随机字符串（后台返回）
					 * package  统一下单接口返回的 prepay_id 参数值  （后台返回）
					 * timeStamp 时间戳（前台设置）
					 * key 微信支付秘钥（微信支付文档获取）
					 * */
					let paySign = md5('appId=' + data.appid + '&nonceStr=' + data.nonce_str + '&package=' + pkg +
						'&signType=MD5&timeStamp=' + timeStamp + "&key=微信支付秘钥").toUpperCase(); //此处用到hexMD5插件
					// 发起支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: timeStamp,  //时间戳
						nonceStr: res.data.data.nonce_str,  //后台返回的随机字符串
						package: pkg,  //统一下单接口返回的 prepay_id 参数值
						signType: 'MD5',  //使用MD5加密
						paySign: paySign,  //签名
						success: (res) =>{  //支付成功的回调
							console.log('success:' + JSON.stringify(res));
						},
						fail: (err) =>{ //支付失败或者取消支付的回调
							console.log('fail:' + JSON.stringify(err));
						}
					});
				}
			}