uniapp整合 YunGouOS-PAY

YunGouOS介绍

YunGouOS 只负责帮助用户在微信、支付宝官方签约申请商户并提供正规官方支付接口。
YunGouOS 旨在解决需要支付交易流的开发者、个体户、个人创业者、公司等提供便捷的支付产品。
YunGouOS 只负责信息流，不负责资金流。支付资金全部由微信/支付宝官方直接结算。YunGouOS平台只是一个支付技术服务平台，不负责结算。

安装

1.在项目根目录下执行

npm i yungouos-pay-uniapp-sdk

2.uniapp 封装一个支付的工具类

//sdk安装教程: https://open.pay.yungouos.com/#/api/download
import {WxPay} from '@/pagesA/node_modules/yungouos-pay-uniapp-sdk'

const pay ={
	/**
	 * 支付
	 * @param {Object} order_id     系统订单号不可重复
	 * @param {Object} body 		商品描述
	 * @param {Object} title 		支付收银小程序页面顶部的title 可自定义品牌名称
	 * @param {Object} total_fee    支付金额
	 */
	doPay(order_id, body, total_fee, title){
		let out_trade_no = order_id;
		let mch_id = "xx";
		let attach = null;
		let notify_url=null;
		let auto = null;
		let auto_node = null;
		let config_no = null;
		let biz_params=null;
		let payKey = "xx";
		WxPay.minAppPay(out_trade_no, total_fee, mch_id, body, attach, title, notify_url, auto, auto_node, config_no, biz_params, payKey);
	},
	/**
	 * 退款
	 * @param {Object} money  		退款金额
	 * @param {Object} out_trade_no 订单号
	 */
	doRefund(money, out_trade_no){
		let mch_id = "xx";
		let refund_desc = "退款描述";
		let notify_url=null;
		let payKey = "xx";
		
		
		WxPay.refund(out_trade_no, mch_id, money, refund_desc, notify_url, payKey).then((response)=>{
			//接口返回结果
			console.log(response);
		});
	},
	
	
}
export default pay

3.在页面中使用

//在mian.js进行全局注册
import pay from './pagesA/common/pay.js'
Vue.prototype.$pay = pay;

//在业务页面进行使用。
methods: {
    pay(){
        var orderId = util.unique();
        var info = "商家认证费用";
        var amount = "1";
        this.$pay.doPay(orderId, info, amount, "xx");
    }
}

4.支付成功处理订单号
支付成功后会回调App.vue的onShow函数。 紧接着再回调当前支付页面的onShow函数。
我们在App.vue将第三方生成orderNo进行全局保存。供支付页面进行获取和逻辑处理。

• App.vue

export default {
    globalData: {
            payStatus: false,
            orderNo: null,
    },
    onShow: function(options) {
        console.log('App Show');
        if (options == null || options == '' 
        || options.referrerInfo == null || options.referrerInfo == '') {
                return;
        }
        console.log('options' + JSON.stringify(options));

        //跳转回商户小程序参数示例：
        //{"code": 0,"data":{"orderNo":"123456"},"msg": "支付成功"}
        let extraData = options.referrerInfo.extraData;
        if (extraData) {
                //不管成功失败 先把支付结果赋值
                this.globalData.payStatus = extraData.code == 0 ? true : false;
                if (extraData.code != 0) {
                        console.log(extraData.msg);
                        uni.showToast({
                                title: extraData.msg, //错误提示
                                icon: 'none',
                                duration: 3000
                        });
                        return;
                }
                //支付成功
                this.globalData.orderNo = extraData.data.orderNo;
        }
	},
 }

• Demo.vue

onShow(options) {
        console.log("index page:"+ JSON.stringify(options));
         //当前支付页面显示时候做的事情
         let globalData = getApp().globalData;
         if(globalData == null||globalData==''||globalData==undefined){
                return;
         }
         let payStatus = globalData.payStatus;
         let orderNo = globalData.orderNo;
         console.log("支付成功"+ orderNo +"payStatus"+ payStatus);
         if(payStatus){
                uni.showToast({
                        title:'支付成功',
                        icon:"success"
                });
         }
         //处理业务逻辑 TODO 调用后台接口更新用户的VIP状态
         console.log("--更新用户的VIP状态---");
		 
	},

参考链接

uniapp对接文档