uniapp微信小程序--微信支付

黑森林里的金刚

已于 2023-03-14 10:04:41 修改

阅读量224

点赞数

分类专栏： uniapp 文章标签：前端 Powered by 金山文档

于 2023-03-03 11:15:58 首次发布

本文链接：https://blog.csdn.net/m0_56561432/article/details/129316569

版权

uniapp 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

该代码段展示了在小程序中进行微信登录并触发支付的过程。首先，使用uni.login获取微信登录的code，然后调用后端接口获取openId。接着，利用openId进行微信支付设置，包括appId、timeStamp、nonceStr、package、signType和paySign等参数，最后处理支付成功或失败的回调事件。

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

<template>
    <view class="">
           <text @tap="recharge">充值</text>
    </view>
</template>

<script>
    export default {
        data() {},
        methods: {
            //充值
            recharge(){
                //获取登录的code
                uni.login({
                    provider: 'weixin',
                    success: (res) => {
                        if (res.code) { //微信登录成功 已拿到code
                            // console.log(res);
                            this.getOpenId(res)
                        } else {
                            console.log('登录失败！' + res.errMsg)
                        }
                    },
                    fail: (err) => {
                        // console.log(err);
                    }
                });     
            },
            getOpenId(item){
                //1、获取的code调用后端接口，后端生成一个openId
                //2、把openId发送给后端，去调用微信官方的支付接口
                uni.requestPayment({
                    provider: 'wxpay',//服务提供商
                    appId: res.data.appId,
                    timeStamp: res.data.timeStamp,//时间戳，从1970年1月1日00:00:00 至今的秒数，即当前的时间
                    nonceStr: res.data.nonceStr,//随机字符串，长度为32个字符以下
                    package: res.data.package,//统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=***
                    signType: res.data.signType,//签名算法，应与后台下单时的值一致
                    paySign: res.data.paySign,//签名
                    success: (res) => {
                        //支付成功的操作
                    },
                    fail: (err) => {
                        // console.log(err);
                        uni.showToast({
                            icon: 'none',
                            title: '支付失败，请重新支付'
                        })
                    }
                );
            },
        }
    }
</script>