Laravel 7收银员条纹每月订阅设置

时间:2020-09-08 07:18:13

标签: javascript laravel laravel-5 stripe-payments laravel-cashier

在设置带条纹的每月订阅时需要帮助。

首先,我将$ intent变量传递给表单所在的视图:

create external table **table** LOCATION '**hdfs_folder**' as 
select
column1, cloumn2,...
from **another_table**
where
**where_condition**

我的HTML表单:

public function checkoutForm()
{
    $user = auth()->user();

    $intent = $user->createSetupIntent();

    return view('app.payments.form', compact('intent'));
}

我的JavaScript:

<form action="{{route('app.payments.checkout')}}" method="POST" id="payment-form">
  @csrf
  <div class="form-row">
    <div>
      <label class="form-label">Email</label>
      <input id="email" name="email" class="form-control">
    </div>
    <div>
      <label class="form-label">Card holder name</label>
      <input id="card-holder-name" name="card-holder-name" class="form-control">
    </div>
  </div>
  <div class="form-row">
    <label for="card-element form-label">
      Credit or debit card
    </label>
    <div id="card-element">
      <!-- A Stripe Element will be inserted here. -->
    </div>
    <!-- Used to display form errors. -->
    <div id="card-errors" role="alert"></div>
  </div>
  <button id="card-button" class="btn btn-success w-auto" data-secret="{{ $intent- 
>client_secret }}">Submit Payment</button>
</form>

然后我将数据传递回后端,首先我创建了一个计划,向用户收费

let stripe = Stripe('pk_test_51HOeq6DJMeDFu');
let elements = stripe.elements();

let card = elements.create('card', {
hidePostalCode: true,
});

// Add an instance of the card Element into the `card-element` <div>.
card.mount('#card-element');
// Handle real-time validation errors from the card Element.
card.on('change', function (event) {
let displayError = document.getElementById('card-errors');
if (event.error) {
 displayError.textContent = event.error.message;
} else {
 displayError.textContent = '';
}
});

// Handle form submission.
let form = document.getElementById('payment-form');
form.addEventListener('submit', function (event) {
  event.preventDefault();

  let options = {
    name: document.getElementById('card-holder-name').value,
    email: document.getElementById('email').value,
}

stripe.createToken(card, options).then(function (result) {
if (result.error) {
  // Inform the user if there was an error.
  let errorElement = document.getElementById('card-errors');
  errorElement.textContent = result.error.message;
 } else {
  // Send the token to your server.
  stripeTokenHandler(result.token);
 }
 });
 });

// Submit the form with the token ID.
function stripeTokenHandler(token) {
  // Insert the token ID into the form so it gets submitted to the server
 let form = document.getElementById('payment-form');
  let hiddenInput = document.createElement('input');
  hiddenInput.setAttribute('type', 'hidden');
  hiddenInput.setAttribute('name', 'stripeToken');
  hiddenInput.setAttribute('value', token.id);
  form.appendChild(hiddenInput);

  // Submit the form
  form.submit();
}

请求发送回stripeToken,验证工作正常,但我想为用户创建一个月度订阅。

但是我不知道如何识别$ paymentMethod变量,有人可以帮我吗?

1 个答案:

答案 0 :(得分:0)

您需要从$request那里获得

$paymentMethod = $request->payment_method;

在前端

cardButton.addEventListener('click', async (e) => {
    let clientSecret = cardButton.dataset.secret;
    const { setupIntent, error } = await stripe.confirmCardSetup(
        clientSecret, {
            payment_method: {
                card: cardElement,
                billing_details: { name: cardHolderName.value }
            }
        }
);

 let {payment_method} = setupIntent;

它创建payment_method,您可以在服务器中获得它