pay项目axios和支付成功验证总结

axios.js

import http from '../axios'
//商户的token
const asstoken = () => "6c6baa88b5e1485188fd6b33267e9ff5";
/*******************通用"接口*******************************/

// 立即支付
export const req_pay_address = (data) => http.post('/order/pay.do', Object.assign(data, { token: asstoken() }));
// 判断支付状态
export const pay_status = (data) => http.post('/order/payStatus.do', Object.assign(data, { token: asstoken() }));

Object.assign(data, { token: asstoken() })说明
Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。键名相同会覆盖

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

为data传递参数

// 点击我已支付
    submit() {
      // 页面之间传递数据,直接在this.$router.push中传递数据
      let data = {
        merchant_orders: this.merchant_orders
      };
      this.$router.push({ path: "/u-payment", query: data });
    },

调接口

 // 初始化
    init() {
      // bug :遇到点击按钮,请求接口返回数据并跳转,可以先跳转,在请求接口,得到数据可以直接跳转
      var data = this.$route.query;

      req_pay_address(data).then(res => {
        console.log('res:');
        console.log(res);
        if (res.result == 1) {
          const data = res.data;
          //商户订单号
          this.merchant_orders = data.merchant_orders;

          this.bankcard_owner_name = data.bankcard_owner_name;
          this.bankcard_id = data.bankcard_id;
          this.opening_bank = data.opening_bank;
          this.practical_money = data.practical_money;
          this.terrace_orders = data.terrace_orders;
          this.qrcode_text = data.zfb_qr_website;
          this.effective_time = data.out_time -Date.parse(new Date())/1000 ;
        } else {
          //错误提示
          alert(res.msg);
        }
      });
    }
  },
 mounted() {
    this.init();
  }

每三秒判断一次支付是否成功

methods: {
    init() {
      // 调用支付接口,判断支付成功显示支付成功,失败了显示支付失败,正在确认状态显示确认中
      // 如果是确认中,每三秒确认一下是否支付成功
      // 接受路由传递过来的数据
      var data = this.$route.query;

      //订单号
      console.log('订单号');
      console.log(data);

      //查询订单号
      pay_status(data).then(res => {
        //支付状态
        if( res.result == 1){
            this.flag = res.data.status;
            //查询成功
            this.pay_money = res.data.practical_money;
            this.pay_time = res.data.updatetime;
            this.pay_id = res.data.merchant_orders;
            console.log(res);
            // 成功、失败、确认中
            if (res.data.status == 1) {
              this.pay_status = "支付成功";
              this.pay_time_str ="支付时间";
              // 直到支付成功,清除定时器
              if (this.timer) {
                clearInterval(this.timer);
              }
            } else if (res.data.status == -1) {
              this.pay_status = "支付失败";
            } else {
              this.pay_status = "支付确认中";
              // bug:当没有定时器时且是支付确认中,调用定时器方法,即第一次请求
              if (!this.timer) {
                this.aa();
              }
            }
        }else if( res.result == 2){

        }else{
          //失败显示信息
          this.pay_status = res.msg;
        }
      });
    },
    // 封装一个定时器,每3秒请求一次接口
    aa() {
      this.timer = setInterval(() => {
        this.init();
      }, 3000);
    }
  },

  // 初始化
  mounted() {
    this.init();
  }
};

猜你喜欢

转载自blog.csdn.net/weixin_43848576/article/details/88099914