当前位置：首页 > article >正文

【uniapp】支付宝付款成功后怎么调回自定义页面

article 2025/3/1 18:39:39

以H5为例（其实兼容app）
1、uniapp跳转第三方链接，新建一个a.vue

// actionUrl为第三方链接（例如后端返回的支付宝链接）
<template>
  <view>
    <web-view :src="actionUrl"></web-view>
  </view>
</template>
<script>
  import {
    mapState,
  } from "vuex"
  export default {
    data() {
      return {}
    },
    onLoad(e) {},
    methods: {
    }
  }
</script>

2.点击支付跳转到a.vue,这里已经调起支付宝支付成功

 uni.navigateTo({
     url: `/pages/a/a`
 })

3.支付成功后页面有一个返回按钮或者其他按钮（后端配置的），点击返回按钮则需要跳转到我们自定义的页面，把以下代码发给后端，后端直接配置跳转

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>app支付确认中</title>
  </head>
  <body>
    <!-- uni 的 SDK -->
	<script type="text/javascript" src="https://unpkg.com/@dcloudio/uni-webview-js@0.0.3/index.js"></script>
<!-- uni 的 SDK，必须引用。 --> 
    <script type="text/javascript">
	    // 假设这是你的当前URL
        const url = new URL(window.location.href);
        const params = new URLSearchParams(url.search);
        // 获取url参数
	    const jiyunNumber = params.get('jiyunNumber');
        // 触发 `UniAppJSBridgeReady` 事件后，即可调用 uni 的 API。
       document.addEventListener('UniAppJSBridgeReady', function() {
       // 以下为自定义跳转逻辑代码
       // 这里做的事是判断订单类型，跳转到app对应的订单支付成功页面 
        if(jiyunNumber.indexOf('GD')>-1){
        // 这里的url为你想要跳转的url
           uni.reLaunch({ url:'/pages/applyFreight/applySuccess/applySuccess?item=0&jiyunNumber='+jiyunNumber})
        }else{
           uni.reLaunch({ url:'/pages/applyFreight/applySuccess/applySuccess'})	
        }
      });
    </script>
  </body>
</html>