uniapp ios 沙盒支付(苹果支付)
此文带书名号"《》"的链接为文档地址,不带书名号的链接为跳转地址。
一、创建项目
1、打开 App Store Connect,创建项目。
App Store Connect:https://developer.apple.com/app-store-connect/
2、创建内购项目
《App 内购买项目》:https://developer.apple.com/cn/in-app-purchase/,随便创建一个内购项目,此文创建的是“消耗型项目”,内购项目的“产品ID”必须唯一。
二、沙盒测试
《沙盒测试》:https://developer.apple.com/cn/apple-pay/sandbox-testing/
1、创建沙盒-测试员
沙盒测试员的账号,需要使用从未与 Apple ID 关联的电子邮件地址。
沙盒-测试员:https://appstoreconnect.apple.com/access/testers
2、添加测试卡号
1、从 iPhone 设备上退出 iCloud 登录,登录沙盒-测试员的账号。
2、打开“钱包”,添加信用卡或借记卡到“钱包”,在《沙盒测试》内找到适用于 App 和网页的测试卡,随便输入一个适合你的地区的卡号,此文使用的是 Discover 测试卡片。
三、打包自定义调试基座
测试沙盒支付需要使用自定义调试基座!
打开HBuilder X,manifest.json。
1、App模块配置-Payment(支付)-勾选“苹果应用内支付”。
2、如果勾选微信支付,需要取消勾选 ios 的微信支付。(如果勾选了,即使 ios 版本 App 内没有使用 ios 微信支付,也可能审核不通过)
3、然后打包 ios 自定义调试基座。
四、uniap iap 支付测试
<template>
<view class="Test-container">
<view class="btns">
<button type="primary" @click="getChannels">获取支付通道</button>
<button type="primary" @click="restoreComplateRequest" v-if="iap">获取已购买商品</button>
</view>
<view class="list">
<view class="item" v-for="i in product_list" :key="i.productid">
<view class="title">{{i.title}}</view>
<view class="price">{{i.price}}元</view>
<button type="warn" @click="pay(i)">支付</button>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
iap: null, // 支付通道
ids: ['app_store_order_balance_1', 'app_store_order_balance_12',
'app_store_order_balance_50'], // 应用内购项目产品 ID 数组
product_list: [] // 应用内购项目列表
};
},
methods: {
// 获取支付通道
getChannels() {
// #ifdef APP-PLUS
plus.payment.getChannels(res => {
let channel = res.find(i => i.id === 'appleiap')
this.iap = channel ? channel : null
this.requestOrder()
}, function(e) {
// plus.nativeUI.alert("获取支付通道失败,请稍后重试。", function() {}, "提示");
})
// #endif
},
// 获取内购项目列表
requestOrder() {
// #ifdef APP-PLUS
this.iap.requestOrder(
this.ids,
res => {
this.product_list = res
},
function(errormsg) {
plus.nativeUI.alert("获取应用内购项目失败,请稍后重试。", function() {}, "提示");
}
)
// #endif
},
// 调起支付
pay(i) {
// #ifdef APP-PLUS
plus.payment.request(this.iap, {
productid: i.productid,
optimize: true // 支付时设置 optimize: true
}, result => {
// 支付成功回调
console.log("plus.payment.request-success--------------------",JSON.stringify(results));
}, e => {
// 用户取消支付或者调起支付失败回调
restoreComplateRequest()
});
// #endif
},
// 获取已购的非消耗性商品和订阅商品
restoreComplateRequest() {
this.iap.restoreComplateRequest({}, results => {
// results 格式为数组存放恢复的IAP商品交易信息对象 IAPTransaction,通用需将返回的支付凭证传给后端进行二次认证
console.log('restoreComplateRequest-results---', JSON.stringify(results))
}, e => {
// 错误回调
console.log('restoreComplateRequest-results ---fail---', JSON.stringify(e))
});
}
}
}
</script>
<style lang="scss">
.Test-container {
padding: 24rpx;
.btns {
button {
margin-bottom: 24rpx;
}
}
.list {
margin-top: 24rpx;
.item {
margin-bottom: 24rpx;
padding: 30rpx;
border-radius: 24rpx;
box-shadow: 0rpx 12rpx 36rpx 0rpx rgba(0, 0, 0, 0.04);
background-color: #252526;
.title {
margin-bottom: 24rpx;
font-size: 36rpx;
font-weight: bold;
color: #FFFFFF;
}
.price {
margin-bottom: 24rpx;
font-size: 36rpx;
font-weight: bold;
color: #FF2C4C;
}
}
}
}
</style>
问题记录
1、requestOrder 获取内购项目列表时,第一个参数是一个数组,即应用内购项目产品 ID 的数组。
['app_store_order_balance_1', 'app_store_order_balance_12','app_store_order_balance_50']
2、plus.payment.request 成功后回调返回一个参数,里面的内容如下,一般需要把 transactionReceipt 传给后台。
{
"payment": {
"productid": "balance_6",
"quantity": "1"
},
"transactionDate": "2021-07-17 12:02:43",
"transactionIdentifier": "1000000843800112", // 交易id
"transactionReceipt": "ewoJInNpZ25hdHVyZSIg", // 校验体,次数省略几百字
"transactionState": "1"
}
3、restoreComplateRequest 成功回调,如果有数据,返回的是数组。
[{
"payment": {
"productid": "balance_6",
"quantity": "1"
},
"transactionDate": "2021-07-17 12:02:43",
"transactionIdentifier": "1000000843800112",
"transactionReceipt": "ewoJInNpZ25hdHVyZSIg",
"transactionState": "1"
},
{
"payment": {
"productid": "balance_12",
"quantity": "1"
},
"transactionDate": "2021-07-17 12:04:23",
"transactionIdentifier": "1000000343800112",
"transactionReceipt": "ewosdqdInNpZ25hdHVyZdqqSIg",
"transactionState": "1"
}
]
1、使用自定义调试基座测试
使用自定义调试基座测试会有很多问题,例如 plus.payment.request 的回调会提前执行或者不执行。每次支付操作都要重复暂停、运行自定义调试基座测试。
打开HBuilder X。
1、运行-运行基座选择-自定义调试基座(iOS)
2、运行-运行到手机或者模拟器-运行到 iPhone
2、使用原生 App 云打包测试
原生 App 云打包测试,选择开发证书打包。这个比自定义调试基座测试体验更好,plus.payment.request 不会出问题。
相关文档
《plus.payment.getChannels》:https://www.html5plus.org/doc/zh_cn/payment.html#plus.payment.getChannels
《Vue&uniapp实现IOS iap支付》https://www.jianshu.com/p/23f6d7dc024a
《关于IAP支付,支付成功后给后端校验的问题》:https://ask.dcloud.net.cn/question/118323
转载请注明来源:《 uniapp ios 沙盒支付(苹果支付)》- rojerYong's Blog
文章链接:https://www.eoway.cn /article/1626521648.html如果此文摘取了你的原创,请联系本站管理员,将对此文修改、删除处理。