【问题标题】:Laravel 7 cashier stripe monthly subscription setupLaravel 7 收银条每月订阅设置
【发布时间】:2020-12-26 13:04:24
【问题描述】:

在使用 Stripe 设置每月订阅方面需要帮助。

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

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

    $intent = $user->createSetupIntent();

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

我的 HTML 表单:

<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>

我的javascript:

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();
}

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

    public function postCheckout(Request $request)
{

    $user = auth()->user();

    \Stripe\Stripe::setApiKey("sk_test_51HOeq6D");

    \Stripe\Plan::create(array(
        "amount" => 20,
        "interval" => "month",
        "product" => array(
            "name" => "Monthly subscription"
        ),
        "currency" => "usd",
        "id" => "Connectplus"
    ));

    try {
        $user->newSubscription('Connectplus', '20')->create($paymentMethod???);
    } catch (\Exception $e) {
        dd($e->getMessage());
    }
}

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

但我不明白如何识别 $paymentMethod 变量,谁能帮我解决这个问题?

【问题讨论】:

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


    【解决方案1】:

    你需要从$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,你可以在服务器中获取它

    【讨论】:

      猜你喜欢
      • 2018-05-31
      • 2019-03-31
      • 1970-01-01
      • 2021-12-06
      • 2021-02-18
      • 1970-01-01
      • 2012-05-03
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多