uincloud版完成微信支付（个人经验）

最新推荐文章于 2024-06-02 22:20:45 发布

Traveler飞

最新推荐文章于 2024-06-02 22:20:45 发布

阅读量1.3k

点赞数 2

文章标签：阿里云云计算

本文链接：https://blog.csdn.net/qq_51438138/article/details/126077812

版权

使用HBuilder创建一个uinapp项目

创建完成之后选择项目根文件夹，右击新建uniCloud云开发环境，这里阿里云或者腾讯都可以，我选择阿里云

完成上面步骤后导入一个uin-id的插件

uni-id - DCloud 插件市场

导入公共模块uniid,成功后会自动在common文件夹下找到uni-id文件夹

然后在uni-id文件夹下建立config.json,内容如下:

{
    "passwordSecret": "passwordSecret-demo",
    "tokenSecret": "tokenSecret-demo",
    "tokenExpiresIn": 7200,
    "tokenExpiresThreshold": 600,
    "passwordErrorLimit": 6,
    "bindTokenToDevice": true,
    "passwordErrorRetryTime": 3600,
    "autoSetInviteCode": false,
    "forceInviteCode": false,
    "app-plus": {
        "tokenExpiresIn": 2592000,
        "oauth" : {
            "weixin" : {
                "appid" : "weixin appid",
                "appsecret" : "weixin appsecret"
            }
        }
    },
    "mp-weixin": {
        "oauth" : {
            "weixin" : {
                "appid" : "你的微信小程序appid",
                "appsecret" : "你的微信小程序appsecret"
            }
        }
    },
    "mp-alipay": {
        "oauth" : {
            "alipay" : {
                "appid" : "alipay appid",
                "privateKey" : "alipay privateKey"
            }
        }
    },
    "service": {
        "sms": {
            "name": "DCloud",
            "codeExpiresIn": 300,
            "smsKey": "your sms key",
            "smsSecret": "your sms secret"
        }
    }
}

具体参数说明请见:

uni-app官网

具体参数说明请见:

uni-id - DCloud 插件市场

在cloudfunctions文件夹下建立getOpenid云函数

const uniID = require('uni-id')

exports.main = async function(event,context) {

    const res = await uniID.code2SessionWeixin({

    code: event.code

  })

    return res

}

在刚刚建立的getOpenid云函数上点击右键,管理公共模块依赖,选择刚刚的uniid,这样以后如果需要修改微信的appid等可以直接修改uni-id函数,修改后右键有个更新所有依赖次函数的模块,就会自动更新

安装unipay,安装好上传即可无需其他操作

uni-pay - DCloud 插件市场

新建getOrderInfo云函数

'use strict';



const unipay = require('unipay')

const unipayIns = unipay.initWeixin({

   appId: '', //小程序appid

   mchId: '', //微信商户号

   key: '', //商户号的API密钥

   //pfx: fs.readFileSync('/path/to/your/pfxfile'), // p12文件路径，使用微信退款时需要，需要注意的是阿里云目前不支持以相对路径读取文件，请使用绝对路径的形式

})

exports.main = async (event, context) => {

   //event为客户端上传的参数

   let orderInfo = await unipayIns.getOrderInfo({

      openid: event.openid, //这个是客户端上传的用户的openid

      subject: event.name, // 订单名称微信支付时不可填写此项

      body: '养老服务费',

      outTradeNo: event.suiji, //给他个随机号让他可以第二次发起支付

      totalFee: event.pric, // 金额，单位元,在上传过来的时候就已经*100了

      notifyUrl: 'https://xxxx.net/PayResult', // 支付结果通知地址

      attach: event.out_trade, //备注,订单号或长者id 在下一步通知中判断长度来确定

   })

   return { orderInfo }



};

notifyUrl:随便填一个可以访问的url地址即可，不然会报错！

在刚刚新建的getOrderInfo云函数上点击右键,选择管理公共模块依赖,选择刚刚的unipay,让他们关联起来

编写小程序端文件

<template>
   <view class="content">
       <image class="logo" src="/static/logo.png"></image>
       <view class="text-area">
           <button @click="pay">支付</button>
       </view>
   </view>
</template>

<script>
   export default {
       data() {
           return {
               title: 'Hello'
           }
       },
       onLoad() {

       },
       methods: {
           pay(){
               // 1.传递weixin 获取微信的code
               uni.login({
               provider: 'weixin',
               success(code) {
               console.log('code:', code.code)
               //2:获得微信openid
               uniCloud.callFunction({
               name: 'getOpenid',
               data: {
               code: code.code
               }
               }).then(openid => {
               console.log('openid:', openid)
               //3:統一下單
               uniCloud.callFunction({
               name: 'getOrderInfo',
               data: {
               openid: openid.result.openid,
               name: '测试',
               out_trade: '123654789', // 订单号
               suiji: Math.floor(Math.random() * 100000000),
               pric: Number(0.1) * 100
               },

               }).then(odr => {
               console.log('OrderInfo:', odr)
               uni.hideLoading(); //隐藏loding...
               uni.requestPayment({
               // #ifdef MP-WEIXIN
               ...odr.result.orderInfo,
               // #endif
               success() {
               uni.showModal({
               title: '支付成功',
               content: '请和顾问联系执行订单即可!'
               })
               },
               fail() {},
               complete() {
               // 支付完成后重新加载该页面
               console.log('完成')
               }
               })
               })

               })
               },
               fail(err) {
               reject(new Error('微信登录失败'))
               }
               })
               // 支付结束
           },

       }
   }
</script>

<style>
   .content {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
   }

   .logo {
       height: 200rpx;
       width: 200rpx;
       margin-top: 200rpx;
       margin-left: auto;
       margin-right: auto;
       margin-bottom: 50rpx;
   }

   .text-area {
       display: flex;
       justify-content: center;
   }

   .title {
       font-size: 36rpx;
       color: #8f8f94;
   }
</style>