fix(payment): 修复支付结果页面的轮询逻辑和返回 URL

- 更新了 Checkout 页面的返回 URL,使用动态获取的窗口位置替代硬编码的 IP 地址
- 优化了支付结果页面的轮询逻辑:
  - 增加了对 5 秒轮询时间的检查,避免长时间轮询
  - 调整了轮询停止的条件,只在支付成功时停止轮询
- 对支付结果页面的 HTML 结构进行了轻微的调整,提高了代码的可读性
This commit is contained in:
xingyy 2025-02-28 15:59:44 +08:00
parent f973f04742
commit bed0e6c4be
2 changed files with 17 additions and 9 deletions

View File

@ -41,7 +41,7 @@ async function handleSubmit(e) {
const { error } = await stripe.confirmPayment({ const { error } = await stripe.confirmPayment({
elements: elements.value, elements: elements.value,
confirmParams: { confirmParams: {
return_url: "http://192.168.88.68:3000/payment/result?orderNo="+payUid.value, return_url: `${window.location.origin}/payment/result?orderNo=${payUid.value}`,
}, },
}) })

View File

@ -14,6 +14,13 @@ let timer = null
let startTime = Date.now() let startTime = Date.now()
const queryOrder = async () => { const queryOrder = async () => {
// 5
if (Date.now() - startTime > 5000) {
clearInterval(timer)
closeToast()
return
}
showLoadingToast({ showLoadingToast({
message: '加载中...', message: '加载中...',
forbidClick: true, forbidClick: true,
@ -27,8 +34,8 @@ const queryOrder = async () => {
if (res.status === 0) { if (res.status === 0) {
resData.value = res.data resData.value = res.data
// 15 //
if (resData.value.status === 1 || Date.now() - startTime > 5000) { if (resData.value.status === 1) {
clearInterval(timer) clearInterval(timer)
closeToast() closeToast()
} }
@ -68,11 +75,12 @@ const goHome = () => {
</script> </script>
<template> <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"> <div class="flex flex-col items-center mt-150px">
<img class="w-119px h-120px mb-36px" src="@/static/images/5554@2x1.png" alt=""> <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-#000 text-16px mb-25px">{{ statusLabel[resData.status] }}!</div>
<div class="text-#999 text-16px">{{resData.currency}}{{resData.money}}</div> <div class="text-#999 text-16px">{{ resData.currency }}{{ resData.money }}</div>
</div> </div>
<div class="w-full mt-auto mb-40px"> <div class="w-full mt-auto mb-40px">
<van-button type="primary" block @click="goHome"> <van-button type="primary" block @click="goHome">