fix(payment): 修复支付结果页面的轮询逻辑和返回 URL
- 更新了 Checkout 页面的返回 URL,使用动态获取的窗口位置替代硬编码的 IP 地址 - 优化了支付结果页面的轮询逻辑: - 增加了对 5 秒轮询时间的检查,避免长时间轮询 - 调整了轮询停止的条件,只在支付成功时停止轮询 - 对支付结果页面的 HTML 结构进行了轻微的调整,提高了代码的可读性
This commit is contained in:
parent
f973f04742
commit
bed0e6c4be
@ -41,7 +41,7 @@ async function handleSubmit(e) {
|
||||
const { error } = await stripe.confirmPayment({
|
||||
elements: elements.value,
|
||||
confirmParams: {
|
||||
return_url: "http://192.168.88.68:3000/payment/result?orderNo="+payUid.value,
|
||||
return_url: `${window.location.origin}/payment/result?orderNo=${payUid.value}`,
|
||||
},
|
||||
})
|
||||
|
||||
|
@ -14,6 +14,13 @@ let timer = null
|
||||
let startTime = Date.now()
|
||||
|
||||
const queryOrder = async () => {
|
||||
// 首先检查是否已经超过5秒
|
||||
if (Date.now() - startTime > 5000) {
|
||||
clearInterval(timer)
|
||||
closeToast()
|
||||
return
|
||||
}
|
||||
|
||||
showLoadingToast({
|
||||
message: '加载中...',
|
||||
forbidClick: true,
|
||||
@ -27,8 +34,8 @@ const queryOrder = async () => {
|
||||
if (res.status === 0) {
|
||||
resData.value = res.data
|
||||
|
||||
// 如果状态为1或者超过5秒,停止轮询
|
||||
if (resData.value.status === 1 || Date.now() - startTime > 5000) {
|
||||
// 只在支付成功时停止轮询
|
||||
if (resData.value.status === 1) {
|
||||
clearInterval(timer)
|
||||
closeToast()
|
||||
}
|
||||
@ -68,11 +75,12 @@ const goHome = () => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="w-[100vw] h-screen-nav bg-[url('@/static/images/3532@2x.png')] bg-cover grow-1 flex flex-col items-center px-30px">
|
||||
<div
|
||||
class="w-[100vw] h-screen-nav bg-[url('@/static/images/3532@2x.png')] bg-cover grow-1 flex flex-col items-center px-30px">
|
||||
<div class="flex flex-col items-center mt-150px">
|
||||
<img class="w-119px h-120px mb-36px" src="@/static/images/5554@2x1.png" alt="">
|
||||
<div class="text-#000 text-16px mb-25px">{{statusLabel[resData.status]}}!</div>
|
||||
<div class="text-#999 text-16px">{{resData.currency}}{{resData.money}}</div>
|
||||
<div class="text-#000 text-16px mb-25px">{{ statusLabel[resData.status] }}!</div>
|
||||
<div class="text-#999 text-16px">{{ resData.currency }}{{ resData.money }}</div>
|
||||
</div>
|
||||
<div class="w-full mt-auto mb-40px">
|
||||
<van-button type="primary" block @click="goHome">
|
||||
|
Loading…
Reference in New Issue
Block a user