uniapp公众号微信支付

1、安装jssdk

npm install jweixin-module --save

2、调用

<template>
	<view
		style="width: 100%;height: 100%;align-items: center; justify-content: center;display: flex;flex-direction:column">
		<view style="margin-top: 20upx;margin-bottom: 20upx;">
			<label style="font-size: 40upx;">爱心捐助</label>
		</view>
		<view>
			<img style="width: 400upx;height: 350upx;" src="../../static/wwx5.png" />
		</view>
		<view>
			<label style="font-size: 50upx;color: #DC7004;">1元</label>
		</view>
		<view style="width: 100%;height: 500upx;">
			<button @click="prepay()" type="primary">支付</button>
		</view>
	</view>
</template>

<script>
	import config from "../../common/config.js"
	import wx from "jweixin-module"
	var jweixin = require('jweixin-module');
	export default {
		props: {},
		data() {
			return {
				openid: '',
				productInfo: {
					appid: '',
					openid: '',
					formcode: '',
					money: '',
					productDesc: ''
				},
				signInfo: {
					appid: '',
					prepay_id: ''
				},

			}
		},
		onShow() {

		},
		created() {
			this.initData();
		},
		onTabItemTap() {


		},
		methods: {
			Recharge() {

			},
			prepay() {
				uni.showLoading({
					title: '加载中......'
				});
				this.productInfo.appid = config.appid
				this.productInfo.formcode = config.uuid2()
				this.productInfo.money = 1
				this.productInfo.productDesc = '爱心捐助'
				this.productInfo.openid = this.openid
				//获取预付款单号
				uni.request({
					url: config.baseurl + "/API/WeixinXiadan",
					method: 'POST',
					dataType: 'json',
					data: JSON.stringify(this.productInfo),
					headers: {
						'Content-Type': "application/json;charset=utf-8"
					},
					success: (res) => {
						try {
							// uni.showToast({
							// 	title: res.data.prepay_id,
							// 	duration: 1000
							// })


							if (res.data.prepay_id != '') {
								//获取签名
								this.paysign(res.data.prepay_id)
							} else {
								uni.showToast({
									title: "获取预处理单号失败",
									duration: 1000
								})
							}

						} catch (e) {}
					},
					fail(res) {
						uni.showToast({
							title: "请求下单预处理失败",
							duration: 1000
						})
					}
				});
			},
			paysign(preid) {
				var that = this
				var t_appid = config.appid
				var t_openid = this.openid
				this.signInfo.appid = config.appid
				this.signInfo.prepay_id = preid
				//获取支付签名加密信息
				uni.request({
					url: config.baseurl + "/API/WeixinSign",
					method: 'POST',
					dataType: 'json',
					data: JSON.stringify(this.signInfo),
					headers: {
						'Content-Type': "application/json;charset=utf-8"
					},
					success: (res) => {
						uni.showLoading({
							title: '支付中......'
						});
						try {

							if (res.data.paySign != '') {
								jweixin.config({
									debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
									appId: t_appid, // 必填，公众号的唯一标识
									timestamp: res.data.timeStamp, // 必填，生成签名的时间戳
									nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
									signature: res.data.paySign, // 必填，签名
									jsApiList: [ //这里是需要用到的接口名称  
										'checkJsApi', //判断当前客户端版本是否支持指定JS接口  
										'onMenuShareAppMessage', //分享接口  
										'getLocation', //获取位置  
										'openLocation', //打开位置  
										'scanQRCode', //扫一扫接口  
										'chooseWXPay', //微信支付  
										'chooseImage', //拍照或从手机相册中选图接口  
										'previewImage', //预览图片接口  
										'uploadImage' //上传图片  
									], // 必填，需要使用的JS接口列表
									openId: t_openid
								});
								//付款
								jweixin.chooseWXPay({
									appId: t_appid,
									timestamp: res.data
									.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
									nonceStr: res.data.nonceStr, // 支付签名随机串，不长于 32
									package: res.data
									.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
									signType: res.data.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
									paySign: res.data.paySign, // 支付签名
									success: function(res) {
										console.log(res)
										//跳转到支付成功页面有这个页面
										// routes.push({
										// 	path: 'download'
										// });
										uni.hideToast();
										uni.showToast({
											title: "付款成功！",
											duration: 1000
										})
										uni.switchTab({
											url: '/pages/member/recharge'
										});

									},
									cancel: function(res) {
										uni.showToast({
											title: "付款失败！",
											duration: 1000
										})
										uni.switchTab({
											url: '/pages/member/recharge'
										});

									},
									fail: function(res) {
										uni.showToast({
											title: "付款失败！",
											duration: 1000
										})
										uni.switchTab({
											url: '/pages/member/recharge'
										});

									}
								});
								//


							} else {
								uni.showToast({
									title: "获取用户签名信息失败",
									duration: 1000
								})
							}

						} catch (e) {
							uni.hideToast();
							uni.showToast({
								title: e.message,
								duration: 2000
							})
						}
					},
					fail(res) {
						uni.showToast({
							title: "请求用户签名信息失败",
							duration: 1000
						})
					}
				});
			},
			initData() {

				var temp_openid = uni.getStorageSync('openid');
				if (temp_openid != '') {
					this.openid = temp_openid;
				}
			},

		},

	}
</script>

<style>

</style>