Skip to content

H
hello uni-app x

DCloud / hello uni-app x

通知 6060
Star 93
Fork 166
H
hello uni-app x
提交 4a566e93 编写于 作者: M mahaifeng
浏览文件
操作

[provider]修改支付示例

上级 ce408716
隐藏空白更改
内联 并排
Showing with 335 addition and 322 deletion
pages/API/provider/provider.uvue
浏览文件 @ 4a566e93
<template> <template>
<!-- #ifdef APP --> <!-- #ifdef APP -->
<scroll-view class="page-scroll-view"> <scroll-view class="page-scroll-view">
<!-- #endif --> <!-- #endif -->
<view class="page"> <view class="page">
<page-head :title="title"></page-head> <page-head :title="title"></page-head>
<view class="service-item" v-for="(item, index) in serviceList" :key="index"> <view class="service-item" v-for="(item, index) in serviceList" :key="index">
<text class="service-name">{{item.name}}:</text> <text class="service-name">{{item.name}}:</text>
<view class="provider-list"> <view class="provider-list">
<!-- #ifdef APP-IOS --> <!-- #ifdef APP-IOS -->
<text class="provider-item" v-for="(item2, index2) in item.provider" :key="index2"> <text class="provider-item" v-for="(item2, index2) in item.provider" :key="index2">
{{item2}} {{item2}}
{{item.providerObjMap.length > 0 ? ':' + JSON.stringify(item.providerObjMap[index2]) : '' }} {{item.providerObjMap.length > 0 ? ':' + JSON.stringify(item.providerObjMap[index2]) : '' }}
</text> </text>
<!-- #endif --> <!-- #endif -->
<!-- #ifdef APP-ANDROID --> <!-- #ifdef APP-ANDROID -->
<text class="provider-item" v-for="(item2, index2) in item.provider" :key="index2"> <text class="provider-item" v-for="(item2, index2) in item.provider" :key="index2">
{{item2}} {{item2}}
{{item.providerObj.length > 0 ? ':' + JSON.stringify(item.providerObj[index2]) : '' }} {{item.providerObj.length > 0 ? ':' + JSON.stringify(item.providerObj[index2]) : '' }}
</text> </text>
<!-- #endif --> <!-- #endif -->
</view> </view>
</view> </view>
<button class="btn-get-provider" type="primary" @click="getProviderIds">getProviderIds</button> <button class="btn-get-provider" type="primary" @click="getProviderIds">getProviderIds</button>
<button class="btn-get-provider" type="primary" @click="getProviderObject">getProviderObject</button> <button class="btn-get-provider" type="primary" @click="getProviderObject">getProviderObject</button>
</view> </view>
<!-- #ifdef APP --> <!-- #ifdef APP -->
</scroll-view> </scroll-view>
<!-- #endif --> <!-- #endif -->
</template> </template>
<script> <script>
type ProviderItem = { type ProviderItem = {
service : string, service : string,
name : string, name : string,
provider : string[], provider : string[],
providerObj : UniProvider[], providerObj : UniProvider[],
providerObjMap : Object[], providerObjMap : Object[],
} }
export default { export default {
data() { data() {
return { return {
title: 'provider', title: 'provider',
flag: false, flag: false,
serviceList: [ serviceList: [
{ service: "oauth", name: "登陆", provider: [], providerObj: [], providerObjMap: [] }, { service: "oauth", name: "登陆", provider: [], providerObj: [], providerObjMap: [] },
{ service: "share", name: "分享", provider: [], providerObj: [], providerObjMap: [] }, { service: "share", name: "分享", provider: [], providerObj: [], providerObjMap: [] },
{ service: "payment", name: "支付", provider: [], providerObj: [], providerObjMap: [] }, { service: "payment", name: "支付", provider: [], providerObj: [], providerObjMap: [] },
{ service: "push", name: "推送", provider: [], providerObj: [], providerObjMap: [] }, { service: "push", name: "推送", provider: [], providerObj: [], providerObjMap: [] },
{ service: "location", name: "定位", provider: [], providerObj: [], providerObjMap: [] } { service: "location", name: "定位", provider: [], providerObj: [], providerObjMap: [] }
] as ProviderItem[], ] as ProviderItem[],
providerObjList: [] as UniProvider[] providerObjList: [] as UniProvider[]
} }
}, },
methods: { methods: {
getProviderIds() { getProviderIds() {
this.serviceList.forEach((item : ProviderItem) => { this.serviceList.forEach((item : ProviderItem) => {
let providerIds = uni.getProviderIds({ let providerIds = uni.getProviderIds({
service: item.service service: item.service
}) })
this.updateProvider(item.service, providerIds); this.updateProvider(item.service, providerIds);
}) })
}, },
updateProvider(service : string, provider ?: string[] | null) { updateProvider(service : string, provider ?: string[] | null) {
const item : ProviderItem | null = this.serviceList.find((item : ProviderItem) : boolean => { const item : ProviderItem | null = this.serviceList.find((item : ProviderItem) : boolean => {
return item.service == service return item.service == service
}); });
if (item != null && provider != null) { if (item != null && provider != null) {
item.provider = provider item.provider = provider
} }
}, },
getProviderObject() { getProviderObject() {
this.flag = true this.flag = true
this.getProviderIds() this.getProviderIds()
let objList = [] let objList = []
this.serviceList.forEach((value) => { this.serviceList.forEach((value) => {
value.provider.forEach((provider) => { value.provider.forEach((provider) => {
let obj = uni.getProviderObject({ let obj = uni.getProviderObject({
service: value.service, service: value.service,
provider: provider provider: provider
}) })
if (obj != null) { if (obj != null) {
console.log(obj) console.log(obj)
console.log(JSON.stringify(obj)) console.log(JSON.stringify(obj))
value.providerObj.push(obj) value.providerObj.push(obj)
if(obj instanceof UniPaymentWxpayProvider ){//判断微信是否安装 // #ifdef APP-ANDROID
var isWeChatInstalled = (obj as UniPaymentWxpayProvider).isWeChatInstalled if (obj instanceof UniPaymentWxpayProvider) {//判断微信是否安装
console.log(isWeChatInstalled) var isWeChatInstalled = (obj as UniPaymentWxpayProvider).isWeChatInstalled
console.log(isWeChatInstalled)
} }
// #ifdef APP-IOS // #endif
const providerObjMap = this.getProviderObjectMap(obj)
console.log(providerObjMap)
value.providerObjMap.push(providerObjMap)
// #endif
}
})
})
},
// #ifdef APP-IOS
getProviderObjectMap(provider : UniProvider) {
const map = new Map() // #ifdef APP-IOS
if (this.hasProperty(provider, 'id') && provider.id != null) { const providerObjMap = this.getProviderObjectMap(obj)
map.set('id', provider.id) console.log(providerObjMap)
} value.providerObjMap.push(providerObjMap)
// #endif
}
})
})
},
// #ifdef APP-IOS
getProviderObjectMap(provider : UniProvider) {
if (this.hasProperty(provider, 'description') && provider.description != null) { const map = new Map()
map.set('description', provider.description) if (this.hasProperty(provider, 'id') && provider.id != null) {
} map.set('id', provider.id)
}
if (this.hasProperty(provider, 'isAppExist') && provider.isAppExist != null) { if (this.hasProperty(provider, 'description') && provider.description != null) {
map.set('isAppExist', provider.isAppExist) map.set('description', provider.description)
} }
if (this.hasProperty(provider, 'isWeChatInstalled') && provider.isWeChatInstalled != null) { if (this.hasProperty(provider, 'isAppExist') && provider.isAppExist != null) {
map.set('isWeChatInstalled', provider.isWeChatInstalled) map.set('isAppExist', provider.isAppExist)
} }
if (this.hasMethod(provider, 'uniqueMethodForProvider')) { if (this.hasProperty(provider, 'isWeChatInstalled') && provider.isWeChatInstalled != null) {
map.set('func-uniqueMethodForProvider', provider.uniqueMethodForProvider()) map.set('isWeChatInstalled', provider.isWeChatInstalled)
} }
return Object.fromEntries(map)
}, if (this.hasMethod(provider, 'uniqueMethodForProvider')) {
hasMethod(provider : UniProvider, methodName : string) { map.set('func-uniqueMethodForProvider', provider.uniqueMethodForProvider())
return typeof provider[methodName] === 'function'; }
}, return Object.fromEntries(map)
hasProperty(provider : UniProvider, propName : string) { },
return propName in provider hasMethod(provider : UniProvider, methodName : string) {
} return typeof provider[methodName] === 'function';
// #endif },
} hasProperty(provider : UniProvider, propName : string) {
} return propName in provider
}
// #endif
}
}
</script> </script>
<style> <style>
.page { .page {
padding: 15px; padding: 15px;
} }
.service-item { .service-item {
margin-top: 10px; margin-top: 10px;
} }
.service-name { .service-name {
font-weight: bold; font-weight: bold;
} }
.provider-list { .provider-list {
margin-left: 32px; margin-left: 32px;
} }
.provider-item { .provider-item {
line-height: 1.5; line-height: 1.5;
} }
.btn-get-provider { .btn-get-provider {
margin-top: 30px; margin-top: 30px;
} }
</style> </style>
pages/API/request-payment/request-payment.uvue
浏览文件 @ 4a566e93
<template> <template>
<page-head title="发起支付"></page-head> <page-head title="发起支付"></page-head>
<template v-if="providerList.length > 0"> <template v-if="providerList.length > 0">
<button style="margin-top: 20px;" type="primary" v-for="(item,index) in providerList" :key="index" <button style="margin-top: 20px;" type="primary" v-for="(item,index) in providerList" :key="index"
@click="requestPayment(item)">{{item.name}}支付</button> @click="requestPayment(item)">{{item.name}}支付</button>
</template> </template>
</template> </template>
<script> <script>
export type PayItem = { id : string, name : string, provider ?: UniProvider } export type PayItem = { id : string, name : string, provider ?: UniProvider }
export default { export default {
data() { data() {
return { return {
btnText: "支付宝支付", btnText: "支付宝支付",
btnType: "primary", btnType: "primary",
orderInfo: "", orderInfo: "",
errorCode: 0, errorCode: 0,
errorMsg: "", errorMsg: "",
complete: false, complete: false,
providerList: [] as PayItem[] providerList: [] as PayItem[]
} }
}, },
onLoad: function () { onLoad: function () {
uni.getProvider({ uni.getProvider({
service: "payment", service: "payment",
success: (e) => { success: (e) => {
console.log("payment success:" + JSON.stringify(e)); console.log("payment success:" + JSON.stringify(e));
let array = e.provider as string[] let array = e.provider as string[]
array.forEach((value : string) => { array.forEach((value : string) => {
switch (value) { switch (value) {
case 'alipay': case 'alipay':
this.providerList.push({ this.providerList.push({
name: '支付宝', name: '支付宝',
id: "alipay", id: "alipay",
provider: e.providers.find((item) : boolean => { provider: e.providers.find((item) : boolean => {
return item.id == 'alipay' return item.id == 'alipay'
}) })
} as PayItem); } as PayItem);
break; break;
case 'wxpay': case 'wxpay':
this.providerList.push({ this.providerList.push({
name: '微信', name: '微信',
id: "wxpay", id: "wxpay",
provider: e.providers.find((item) : boolean => { provider: e.providers.find((item) : boolean => {
return item.id == 'wxpay' return item.id == 'wxpay'
}) })
} as PayItem); } as PayItem);
break; break;
default: default:
break; break;
} }
}) })
}, },
fail: (e) => { fail: (e) => {
console.log("获取支付通道失败：", e); console.log("获取支付通道失败：", e);
} }
}); });
}, },
methods: { methods: {
requestPayment(e : PayItem) { requestPayment(e : PayItem) {
const provider = e.id const provider = e.id
if (provider == "alipay") { if (provider == "alipay") {
this.payAli() this.payAli()
} else if (provider == "wxpay") { } else if (provider == "wxpay") {
// #ifdef APP-ANDROID
if (e.provider != null && e.provider instanceof UniPaymentWxpayProvider && !((e.provider as UniPaymentWxpayProvider).isWeChatInstalled)) {
uni.showToast({
title: "微信没有安装",
icon: 'error'
})
} else {
this.payWX()
}
// #endif
// #ifdef APP-IOS
if (e.provider != null && !e.provider.isAppExist)) {
uni.showToast({
title: "微信没有安装",
icon: 'error'
})
} else {
this.payWX()
}
// #endif
}
},
payAli() {
uni.showLoading({
title: "请求中..."
})
uni.request({
url: 'https://demo.dcloud.net.cn/payment/alipay/?total=0.01',
method: 'GET',
timeout: 6000,
success: (res) => {
this.orderInfo = JSON.stringify(res.data);
console.log("====" + this.orderInfo)
uni.hideLoading()
uni.requestPayment({
provider: "alipay",
orderInfo: res.data as string,
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
icon: 'error',
title: 'errorCode:' + this.errorCode
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (e) => {
console.log(e)
uni.hideLoading()
},
});
},
payWX() {
uni.showLoading({
title: "请求中..."
})
let url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__uniappx/?total=0.01'
const res = uni.getAppBaseInfo();
let packageName : string | null
if (e.provider != null && e.provider?.isAppExist==false) { // #ifdef APP-ANDROID
uni.showToast({ packageName = res.packageName
title: "微信没有安装", // #endif
icon:'error'
})
} else {
this.payWX()
}
} // #ifdef APP-IOS
}, packageName = res.bundleId
payAli() { // #endif
uni.showLoading({
title: "请求中..."
})
uni.request({
url: 'https://demo.dcloud.net.cn/payment/alipay/?total=0.01',
method: 'GET',
timeout: 6000,
success: (res) => {
this.orderInfo = JSON.stringify(res.data);
console.log("====" + this.orderInfo)
uni.hideLoading()
uni.requestPayment({
provider: "alipay",
orderInfo: res.data as string,
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
icon: 'error',
title: 'errorCode:' + this.errorCode
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (e) => {
console.log(e)
uni.hideLoading()
},
});
},
payWX() {
uni.showLoading({
title: "请求中..."
})
let url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__uniappx/?total=0.01'
const res = uni.getAppBaseInfo();
let packageName:string | null
// #ifdef APP-ANDROID
packageName = res.packageName
// #endif
// #ifdef APP-IOS
packageName = res.bundleId
// #endif
if (packageName == 'io.dcloud.hellouniappx') {//hello uniappx
url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__HelloUniAppX/?total=0.01'
}
uni.request({
url: url,
method: 'GET',
timeout: 6000,
header: {
"Content-Type": "application/json"
} as UTSJSONObject,
success: (res) => {
console.log(res.data)
uni.hideLoading()
uni.requestPayment({
provider: "wxpay",
orderInfo: JSON.stringify(res.data),
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
duration: 5000,
icon: 'error',
title: 'errorCode:' + this.errorCode,
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
duration: 5000,
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (res) => {
uni.hideLoading()
console.log(res)
},
});
},
//自动化测试使用 if (packageName == 'io.dcloud.hellouniappx') {//hello uniappx
jest_pay() { url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__HelloUniAppX/?total=0.01'
uni.requestPayment({ }
provider: "alipay", uni.request({
orderInfo: this.orderInfo, url: url,
fail: (res : RequestPaymentFail) => { method: 'GET',
this.errorCode = res.errCode timeout: 6000,
this.complete = true header: {
}, "Content-Type": "application/json"
success: (res : RequestPaymentSuccess) => { } as UTSJSONObject,
console.log(JSON.stringify(res)) success: (res) => {
this.complete = true console.log(res.data)
} uni.hideLoading()
} as RequestPaymentOptions) uni.requestPayment({
} provider: "wxpay",
} orderInfo: JSON.stringify(res.data),
} fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
duration: 5000,
icon: 'error',
title: 'errorCode:' + this.errorCode,
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
duration: 5000,
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (res) => {
uni.hideLoading()
console.log(res)
},
});
},
//自动化测试使用
jest_pay() {
uni.requestPayment({
provider: "alipay",
orderInfo: this.orderInfo,
fail: (res : RequestPaymentFail) => {
this.errorCode = res.errCode
this.complete = true
},
success: (res : RequestPaymentSuccess) => {
console.log(JSON.stringify(res))
this.complete = true
}
} as RequestPaymentOptions)
}
}
}
</script> </script>
<style> <style>
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或