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