使用uniapp在前端实现支付功能 思路代码均有


 


### 因为我做的这个是个APP,所以从APP的角度来看如何实现支付。


最简单的一个思路就是 发送订单的相关数据(比如 价格数量等)发送到后台 ,让后台生成一个订单给返回到前台,然后前台拿着这个订单数据去调支付API
主要工作是在后台进行,前台我认为只是需要发起两次请求。
[uni.requestPayment(OBJECT)官方文档](https://uniapp.dcloud.io/api/plugins/payment)

## 下面是发送获取订单请求的代码
```yaml
function getOrderInfo(orderType, payMethod, buyAmount, payPrice) {
// 获取订单的地址
let url = 根据自己实际情况配置;
uni.request({
url: url,
method: "POST",
header: {
userId,
userToken
},
data: {
userId: userId,
orderType: orderType,
buyAmount: buyAmount,
payPrice: countMoney,
payMethod: methods
},
success: (result) => {
console.log(result);
res(result);
},
fail: (e) => {
err(e);
}
})
})
}

```

## 下面是发送支付请求的代码

 

```yaml
支付类型orderType 支付方式payMethod 1:微信APP 2:支付宝APP 支付数量buyAmount 支付金额 payPrice
async function requestPayment(orderType, payMethod, buyAmount, payPrice) {
// await login();
console.log("获取订单前")
let orderInfo = await getOrderInfo(orderType, payMethod, buyAmount, payPrice);
console.log("得到订单信息", orderInfo);
if (orderInfo.statusCode !== 200) {
console.log("获得订单信息失败", orderInfo);
uni.showModal({
content: "获得订单信息失败",
showCancel: false
})
return;
}
// 去支付

// console.log(xinxi);
uni.requestPayment({
// 支付方式
provider: payMethod,
// 订单内容
orderInfo: orderInfo.data.data,
success: (res) => {
console.log("success", JSON.stringify(res));
return res;
},
fail: (err) => {
console.log("fail", JSON.stringify(err));
return err;
}
})
}
```


这个我仅在APP使用,其他的地方不清数是否一致。

[PHP实现支付csdn搜索列表](https://so.csdn.net/so/search/s.do?q=php%E5%AE%9E%E7%8E%B0%E6%94%AF%E4%BB%98&t=&u=)
[JAVA实现支付csdn搜索列表](https://so.csdn.net/so/search/s.do?q=java%E5%AE%9E%E7%8E%B0%E6%94%AF%E4%BB%98&t=&u=)
#### 友情提示一哈,要实现支付 一定要把相关的配置给整好 不然微信支付会一直报错。
环境配置:
在manifest.json中 APP SDK 配置中 勾选支付,配好appid
APP 模块权限中勾选支付。
最后,制作了一个自定义基座,把自己APP的证书上传。使用自定义基座运行实现了微信支付。
### 支付流程

1、支付宝支付

app—------调用支付接口(传递id,金钱,支付类型)

后台调用第三方,返回回调接口,和交易码、商品名、金额

app通过sdk调用支付宝,传递商品名、回调地址、交易码、金额

支付后查看第三方返回的状态是成功还是失败,还是处理中,成功的话调用后台接口获取支付状态

2、微信支付

app—------调用支付接口(传递id,金钱,支付类型)

后台调用第三方,返回预支付id

app把预支付id提交给微信,再刷新状态接口

3、银联支付

app—------调用支付接口(传递id,金钱,支付类型)

后台调用第三方,返回银联交易号

app通过sdk 传递银联交易号给银联做支付

4、ios内购

1.客户端向Appstore请求购买产品,Appstore验证产品成功后,从客户端的Apple账户中扣费。

2.Appstore向客户端返回一段receipt-data(票据),里面记录了本次交易的证书和签名信息。

3.客户端向我们可以信任的服务器(后台)提供receipt-data

4.服务器对receipt-data进行一次base64编码

5.把编码后的receipt-data发往itunes.appstore进行验证

6.itunes.appstore返回验证结果给服务器

7.服务器对商品购买状态以及商品类型,向客户端发放相应的道具与推送数据更新通知

漏票原因及解决办法

出现的两种验证方式:

IAP built-in Model(本地验证):此种方式跳过来3-7步,在第2步中拿到票据直接向itunes.appstore请求验证票据,根据票据的结果来修改数据。有一些单机游戏因为不涉及后台服务器会采取此种方式,但由此单来的不安全也很明显,比如一些越狱的手机会很容易对此进行一些数据操作。这里暂不做讨论。

IAP Server Model(服务器验证):如果把数据放在服务器做校验(如实走完1-7的流程),就不用担心客户端出现伪造票据等问题。但是这样还会出现问题。

想象一下,如果得到票据说明苹果已经扣款成功,就在这时向服务器发送票据验证的时候出现来异常,这个时候可能网络突然断了,未把票据发送的服务器验证,导致明明已经扣了款,却没有收到相应的内购产品,出现了漏单问题。

一:得到票据,立即保存本地,并向服务器验证

二:验证成功,删除本地保存数据。若未成功,再次验证重试。

三:APP重启时,如有本地票据则与服务器进行认证,若认证成功则删除票据。

四:若以上流程还未能解决漏单问题,则可在APP增加类似找回按钮,依据本地保存票据进行找回(流程三)。

注:服务器需建立表单记录票据数据,避免多次增加内购产品。

作者:仰望星空_4645
链接:https://www.jianshu.com/p/d9a8936d5932
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。


# 最后,读者如果发现了什么问题,望不吝赐教,拜谢各位大佬。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM