Laravel Vue Stripe:如何将client_secret PaymentIntent从客户端传递到服务器端?

时间:2020-07-02 15:46:39

标签: laravel vue.js stripe-payments

我正在使用带有laravel和vue js的条纹。条纹支持告诉我,我必须强制执行paymentIntent函数。所有代码都可以正常工作,问题是在服务器端我必须传递client_secre,我不知道该怎么做... 这是代码...

服务器脚本

 \Stripe\Stripe::setApiKey('MY_KEY');
try {
 \Stripe\PaymentIntent::create([
    'currency' => 'EUR',
    'amount'   => $request->amount * 100,
    'description' => 'Donazione',
    'metadata' => [
        'customer' => $request->name,
        'integration_check' => 'accept_a_payment'
    ]
  ]);

客户端文字

import { Card, createToken } from 'vue-stripe-elements-plus'
export default {
    components: { Card },
    data () {
        return {
            complete: false,
            errorMessage: '', 
            stripeOptions: {
                // see https://stripe.com/docs/stripe.js#element-options for details
                style: {
                    base: {
                        color: '#32325d',
                        lineHeight: '18px',
                        fontFamily: '"Raleway", Helvetica, sans-serif',
                        fontSmoothing: 'antialiased',
                        fontSize: '16px',
                        '::placeholder': {
                            color: '#aab7c4'
                        }
                    },
                    invalid: {
                        color: '#fa755a',
                        iconColor: '#fa755a'
                    }
                },
                hidePostalCode: true
            }
        }
    },
    methods: {
        pay () {
             
            //createToken().then(data => console.log(data.token))
           
            // Instead of creatToken I have to use confirmCardPayment() and pass the client_secret

        },
        change(event) {
            // if (event.error) {
            //   this.errorMessage = event.error.message;
            // } else {
            //   this.errorMessage = ''
            // }
            this.errorMessage = event.error ? event.error.message : ''
        }
    }
}

1 个答案:

答案 0 :(得分:0)

我最近不得不在平台上进行设置,这就是我的操作方法。我创建了一个控制器:

PaymentIntentController.php

Stripe::setApiKey(env('STRIPE_SECRET'));

$payment_intent = PaymentIntent::create([
  'payment_method_types' => ['card'],
  'amount' => $request->invoice['total'] * 100,
  'currency' => $this->currency($request),
  'receipt_email' => $request->invoice['clients_email']
], 
[
  'stripe_account' => $request->user['stripe_user_id']
]);

return $payment_intent;

在客户端,您需要在此控制器上发出Axios请求,这样您才能获得Payment_intent。 像这样:

loadPaymentIntent () {
    axios.post('/api/stripe/connect_payment_intent', {'invoice': this.invoice, 'user': this.user}).then((response) => {
      this.paymentIntent = response.data
    })
},

显示结帐表格时,我可以加载我的付款方式设置。然后,在提交表单后,我们就可以访问payment_intent,我们可以在confirmCardPayment方法中使用它,例如:

submit () {
      let self = this
      self.isLoading = true
      self.stripe.confirmCardPayment(self.paymentIntent.client_secret, {
        return_url: self.returnUrl + `/clients/${self.invoice.client_id}/invoices/${self.invoice.id}`,
        receipt_email: self.invoice.clients_email,
        payment_method: {
          card: self.card,
          billing_details: {
            name: self.formData.name,
          }
        }
      }).then(function(result) {
        if (result.error) {
          self.isLoading = false
          self.cardError.status = true
          self.cardError.message = result.error.message

          setTimeout(() => {
            self.cardError = {}
          }, 3000)
        } else {
          if (result.paymentIntent.status === 'succeeded') {
            self.handleInvoice(result.paymentIntent)
            self.closeModal()

            setTimeout(() => {
              location.href = self.returnUrl + `/clients/${self.invoice.client_id}/invoices/${self.invoice.id}?success=true`
            }, 1000)
          }
        }
      });
    },