uniapp四步搞定支付

传统的开发支付需要前后端做很多工作,各种参数的处理,签名,秘钥的验证校验等,尤其是涉及到多种不同的平台支付,更是繁琐;而且以往的支付是由后端主导的,如果后端是个菜鸡,那么做这个支付会相当累人,所以为了避免这种障碍,前端只需要一个人就能搞定支付,uniapp的云开发提供了一种方式,一套代码兼容不同的支付方式,小程序,App,H5等一网打尽,最主要还免费。

下面就介绍下这种无脑开发的支付方式有多简单,但前提是使用的框架要能够创建uniCloud云空间,否则下列的做法可能不适合!

第一步:项目创建云空间;

在Hbuilderx中选择项目,右键创建云开发环境,目前只有腾讯云和阿里云,阿里云是免费的,如果是仅仅做支付,阿里云是足够的;项目中如果已经存在云空间,则不用创建;创建之后,会在cloundfunctions文件夹中含有common目录和database,common是放置公共模块的目录,database是数据库相关的目录,只做支付的话,不涉及到database目录;

第二步:引入uni-pay插件:

可以通过在插件市场引入或者npm的方式下载,现在主要说的是插件市场引入,引入之后,会在common目录下引入uni-pay模块,里面默认有index.js和package.json文件;之后再上传公共模块到服务空间;

第三步:云函数的创建及编写:

云函数的创建,在uniCloud/cloudfunctions中右键创建云函数,会默认生成index.js文件,是该云函数的入口文件;注意:云函数的创建同名,则会覆盖;

如果该云函数依赖某个公共模块的函数,需要安装该公共模块函数的依赖;如果uni-pay是通过uni_modules引入的,这时在云函数目录右键“管理公共模块依赖”,需要哪个公共模块,则选择那个;依赖安装之后,在index.js中引入uni-pay;如果uni-pay是通过非uni_modules安装的,则需要先给该函数通过npm init -y生成package.json文件,再在该云函数中通过终端,执行npm install '需要引入的云函数模块路径';

云函数的编写,以App的微信支付为例:

先要引入uni-pay; const unipay = require('unipay');

再初始化unipay实例

const unipayIns = unipay.initWeixin({

  appId: 'your appId',//应用在对应支付平台的appId

  mchId: 'your mchId',//商户号

  key: 'you parterner key',//支付秘钥

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

})

支付的参数,以app 的微信支付为例

exports.main = async function (event,context) { //event是客户端传过来的参数

    let orderInfo = await unipayIns.getOrderInfo({ 

        body: '商品描述',

        outTradeNo: '商户订单号',

        totalFee: 1, // 金额,单位分

tradeType:'APP'

        notifyUrl: 'https://xxx.xx' // 支付结果通知地址

    })

    return {

        orderInfo

    }

}

第四步:客户端调用云函数

uniCloud.callFunction({

    name: 'getOrderInfo', //这个name是需要调用的云函数名称

    data:{},//支付所需要的参数,用于向云函数传递

    success(res) {

        uni.requestPayment({

      // #ifdef APP-PLUS

      provider: ‘wxpay’// App端此参数必填,可以通过uni.getProvider获取

      // #endif

      // #ifdef MP-WEIXIN

      ...res.result.orderInfo,

      // #endif

      // #ifdef APP-PLUS || MP-ALIPAY

      orderInfo: res.result.orderInfo,

      // #endif

            ...res.result.orderInfo

            success(){

返回支付结果

    },

            fail(){}

        })

    }

})

至此,支付的流程已经结束,付款结果会返回,如果需要查询订单,则需要调用unipayIns.orderQuery函数去查询了。

Tip1:项目如果需要微信和支付宝两种支付方式甚至还要加上小程序的支付,那么可以将不同类型的支付方式封装到模块中,再在每个云函数中进行初始化操作;方式是在云函数的common下,新建公共模块,命名为config,在该文件的index.js中分别配置不同支付方式对应的参数,再通过需要调用的云函数安装依赖,并引入,方式与引入uni-pay的方式一样;需要注意的是在客户端调用该函数时,需要用参数标识好不同的支付方式,这样在调用的云函数中就能处理不同的参数。

Tip2:totalFee传入金额的单位是分,如果业务给的是元,则需要*100转为分,注意一些比较特殊的数字,例如1.1,如果仅仅是*100就ok的话,那么1.1这个数字支付会报错的,原因自己打印下就知道,所以最后传递的金额浮点数要注意;

Tip3: 订单号要注意,不能重复。

Tip4:云开发的支付方式基本上完全丢掉了后端的参与,但如果你的项目并非全完的云开发,业务本身还需要后端参与的话,支付完成的结果还是需要后端修改支付的状态的,所以就要跟后端约定好,支付通知地址接收到平台的通知时,就去修改业务的支付状态,避免出现支付已经完成,但支付的状态还未更改;再假如,你们的后端是个大菜鸡,你怕他的骚操作可能会接收不到平台服务器的支付结果,所以你可以继续调用查询订单的云函数,将支付结果通过接口返给后端,这样他就有了双重保证去修改业务的状态了!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,456评论 5 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,370评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,337评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,583评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,596评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,572评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,936评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,595评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,850评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,601评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,685评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,371评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,951评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,934评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,167评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,636评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,411评论 2 342

推荐阅读更多精彩内容