PayPal支付成功后的页面跳转处理

1.最简单的方式是用商家账户登录后配置支付成功后的跳转URL，设置方法如下

设置PayPal返回URL并使其自动返回是指在使用PayPal进行支付时，设置支付成功后返回的页面URL，以便用户在支付完成后自动返回到指定的页面。这个功能可以在PayPal的商户后台进行设置。

以下是设置PayPal返回URL并使其自动返回的步骤：

1. 登录PayPal商户后台。
2. 在左侧菜单中选择“Account Settings”（账户设置）。
3. 在“Website Payments”（网站支付）下，点击“Update”（更新）按钮。
4. 在“PayPal Account Optional Settings”（PayPal账户可选设置）中，选择“Auto Return”（自动返回）。
5. 在“Return URL”（返回URL）中输入支付成功后要返回的页面URL。
6. 点击“Save”（保存）按钮完成设置。

设置完成后，当用户使用PayPal进行支付时，支付成功后将自动返回到设置的页面URL。这可以提高用户体验，并方便商家进行后续的订单处理。

关于支付成功后的URL内容根据PayPal要求是：您必须在返回URL所显示的页面上向买家解释付款已完成，交易已完成。

示例：感谢您的付款。您的交易已完成，您的购买收据已通过电子邮件发送给您。登录您的PayPal账户查看交易详情。

2.可以使用vue-paypal-checkout  前端通过支付成功的回调函数处理跳转的业务逻辑。

<template>
    <div>
      <div >
        <paypal-checkout
      
          :client="credentials"
          :amount="amountop"
          :currency="currency"
          :intent="'capture'"
          env="sandbox"
          :button-style="buttonStyle" 
  @payment-authorized="paymentAuthorized"
  @payment-completed="paymentCompleted"
  @payment-cancelled="paymentCancelled"
        />
      </div>
    </div>
  </template>
  
  <script>
import paypalCheckout from 'vue-paypal-checkout'
//client_id是商家的
  export default {
    name: 'PayPalCheckout',
    data() {
      return {
        credentials: {
    sandbox: '测试环境client_id',
    production: '填写线上环境client_id'
   },
        currency: 'USD',
        buttonStyle: {
        label: 'paypal',
        size: 'large'
      }
      };
    },
    props:{
        amountop:{
         type: [String,Number],
         default: '',
        }
    },
    components:{paypalCheckout},
    methods: {
        paymentAuthorized (data) {
      // 授权完成的回调，可以拿到订单id
      console.log(data,'授权完成的回调');
    },

    paymentCompleted (data) {
      // 用户支付完成的回调，可以拿到订单id
      console.log(data,'支付完成的回调');
    },

    paymentCancelled (data) {
      // 用户取消交易的回调
      console.log(data,'用户取消的回调');
    }
    },
  };
  </script>
  
  <style lang="scss" >

  </style>
  

3.后端在接收到paypal支付成功的相应后带参数跳转到前端路由页面