10行代码实现微信小程序支付功能,使用小程序云开发实现小程序支付功能(含源码_带微信支付的app源码(1)

四,编写云函数pay

完整代码如下

//云开发实现支付
const cloud = require(‘wx-server-sdk’)
cloud.init()

//1,引入支付的三方依赖
const tenpay = require(‘tenpay’);
//2,配置支付信息
const config = {
  appid: ‘你的小程序appid’, 
  mchid: ‘你的微信商户号’,
  partnerKey: ‘微信支付安全密钥’, 
  notify_url: ‘支付回调网址,这里可以先随意填一个网址’, 
  spbill_create_ip: ‘127.0.0.1’ //这里填这个就可以
};

exports.main = async(event, context) => {
  const wxContext = cloud.getWXContext()
  let {
    orderid,
    money
  } = event;
  //3,初始化支付
  const api = tenpay.init(config);

let result = await api.getPayParams({
    out_trade_no: orderid,
    body: ‘商品简单描述’,
    total_fee: money, //订单金额(分),
    openid: wxContext.OPENID //付款用户的openid
  });
  return result;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
一定要注意把appid,mchid,partnerKey换成你自己的。
到这里我们获取小程序支付所需参数的云函数代码就编写完成了。
不要忘记上传这个云函数。

出现下图就代表上传成功

五,写一个简单的页面,用来提交订单,调用pay云函数。

这个页面很简单,
1,自己随便编写一个订单号(这个订单号要大于6位)
2,自己随便填写一个订单价(单位是分)
3,点击按钮,调用pay云函数。获取支付所需参数。

下图是官方支付api所需要的一些必须参数。

下图是我们调用pay云函数获取的参数,和上图所需要的是不是一样。

六,调用wx.requestPayment实现支付
下图是官方的示例代码

这里不在做具体讲解了,把完整代码给大家贴出来

// pages/pay/pay.js
Page({
  //提交订单
  formSubmit: function(e) {
    let that = this;
    let formData = e.detail.value
    console.log(‘form发生了submit事件,携带数据为:’, formData)
    wx.cloud.callFunction({
      name: “pay”,
      data: {
        orderid: “” + formData.orderid,
        money: formData.money
      },
      success(res) {
        console.log(“提交成功”, res.result)
        that.pay(res.result)
      },
      fail(res) {
        console.log(“提交失败”, res)
      }
    })
  },

//实现小程序支付
  pay(payData) {
    //官方标准的支付方法
    wx.requestPayment({
      timeStamp: payData.timeStamp,
      nonceStr: payData.nonceStr,
      package: payData.package, //统一下单接口返回的 prepay_id 格式如:prepay_id=***
      signType: ‘MD5’,
      paySign: payData.paySign, //签名
      success(res) {
        console.log(“支付成功”, res)
      },
      fail(res) {
        console.log(“支付失败”, res)
      },
      complete(res) {
        console.log(“支付完成”, res)
      }
    })
  }
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

最后更多分享:前端字节跳动真题解析

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

19
20

最后更多分享:前端字节跳动真题解析

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

  • [外链图片转存中…(img-Ndjl3meo-1714232862622)]
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序支付是指在微信小程序实现支付功能的一种方式。而uniapp是一种跨平台开发框架,可以使用一套代码同时开发出小程序App、H5等多个平台的应用程序。 在uniapp实现微信小程序支付,首先需要引入相关的uniapp插件,如"uniapp-pull-refresh"插件用于下拉刷新、"uniapp-picker"插件用于选择器等。然后,在代码中调用相关的支付API,进支付流程的编写。 在uniapp实现微信小程序支付代码如下所示: 1. 引入uniapp中的微信支付插件: ``` import { wxPay } from 'uniapp-wx-pay' ``` 2. 对支付参数进设置: ``` const payData = { appId: 'xxxx', // 微信开放平台的AppId timeStamp: 'xxxx', // 时间戳 nonceStr: 'xxxx', // 随机字符串 package: 'xxxx', // 统一下单接口返回的 prepay_id 参数值 signType: 'MD5', // 签名算法类型,默认为 MD5 paySign: 'xxxx' // 签名 } ``` 3. 调用微信支付API进支付: ``` wxPay(payData).then(res => { console.log('支付成功') }).catch(err => { console.log('支付失败') }) ``` 通过以上代码,即可在uniapp实现微信小程序支付功能。当用户点击支付按钮时,会调用微信支付API,打开微信支付界面,用户输入支付密码后,支付结果会通过回调函数返回,开发者可以根据支付结果做相应的业务处理。 需要注意的是,在进微信小程序支付前,需要先在微信开放平台注册小程序,获取AppId,并在小程序后台设置支付参数和配置支付证书。 总结起来,实现微信小程序支付的uniapp源码主要包括引入相关插件、设置支付参数和调用支付API等步骤。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值