>  기사  >  웹 프론트엔드  >  vue.js를 통해 WeChat 결제 구현

vue.js를 통해 WeChat 결제 구현

亚连
亚连원래의
2018-06-06 14:16:474782검색

이제 vue.js WeChat 결제 프런트 엔드 코드를 공유하겠습니다. 매우 좋은 참조 값을 가지고 있습니다. 그것이 모두에게 도움이 되기를 바랍니다.

예제는 다음과 같습니다.

onBridgeReady: function () {
  const openId = localStorage.getItem('openId')
  payService.payment(this.$route.params.orderId, 1, openId).then(rt => { //1:支付类型,可不填
  this.message = rt.t
  WeixinJSBridge.invoke(
    'getBrandWCPayRequest', {
    'appId': this.message.appId,
    'timeStamp': this.message.timeStamp,
    'nonceStr': this.message.nonceStr,
    'package': this.message.package,
    'signType': this.message.signType,
    'paySign': this.message.paySign
    },
   function (res) {
   console.log(res)
   if (res.err_msg === 'get_brand_wcpay_request:ok') {
    Toast('微信支付成功')
    this.$router.push('/MineOrder')
   } else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
    Toast('用户取消支付')
    // window.location.href = 'gift_failview.do?out_trade_no=' + this.orderId
   } else if (res.err_msg === 'get_brand_wcpay_request:fail') {
    Toast('网络异常,请重试')
   }
   }
  )
  })
 },
 callpay: function () {
  if (typeof WeixinJSBridge === 'undefined') {
  if (document.addEventListener) {
   document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(), false)
  } else if (document.attachEvent) {
   document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady())
   document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady())
  }
  } else {
  this.onBridgeReady()
  }
 }

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되기를 바랍니다.

관련 기사:

Angularjs에서 테이블에 tr을 추가하는 방법을 구현하는 방법

Angular에서 json 객체를 배열에 푸시하는 방법을 사용하는 방법

배열에 포함되어 있는지 확인하는 방법 Anglejs의 요소

위 내용은 vue.js를 통해 WeChat 결제 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.