0

Function of controller in Laravel:

public function postCheckout(Request $request) {
    if(! Session::has('cart')){
        return redirect()->route('product.shoppingCart');
    }
    $oldCart = Session::get('cart');
    $cart = new Cart($oldCart);
    Stripe::setApiKey('XXXXXXXXXXXX');
    //dd($request->input());
    try {
        Charge::create(array(
            "amount" => $cart->totalPrice*100 ,
            "currency" => "cad",
            "source" => $request->input('stripeToken'), // obtained with Stripe.js
            "description" => "Test charge..."
        ));
    } catch (\Exception $e) {
        return redirect()->route('checkout')->with('error', $e->getMessage() );
    }
    Session::forget('cart');
    return redirect()->route('welcome')->with('success','Successfully purchased products !');
}

JavaScript code in the view:

var stripe = Stripe('YYYYYYYYYYYY');
var elements = stripe.elements();
var card = elements.create('card');

card.mount('#card-element');
card.addEventListener('change', function(event) {
  var displayError = document.getElementById('charge-error');
  if (event.error) {
    displayError.textContent = event.error.message;
  } else {
    displayError.textContent = '';
  }
});

var form = document.getElementById('checkout-form');

form.addEventListener('click', function() {
  // event.preventDefault();
  stripe.createToken(card).then(function(result) {
    if (result.error) {
      // Inform the customer that there was an error.
      var errorElement = document.getElementById('charge-error');
      errorElement.textContent = result.error.message;
    } else {
      stripeTokenHandler(result.token);
    }
  });
});

This function creates the hidden input to send data to the server, it inserts the token ID into the form, so it gets submitted to the server:

function stripeTokenHandler(token) {
  var form = document.getElementById('checkout-form');
  var 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();
}

The HTML form:

<form action="{{ route('checkout.post') }}" method="post" id="checkout-form">
  <label for="card-element">Credit or debit card</label>
  <div id="card-element"></div>
  {{ csrf_field() }}
  <button class="btn btn-success">Submit</button>
</form>

The response must provide source or customer.

user7637745
  • 965
  • 2
  • 14
  • 27
  • So have you debugged your form request to see if a token exists in the data sent to your server? – Joe Jul 04 '18 at 15:22
  • yes, but token is not existed ! javascript doesn't send token ! – Ramin Jormozeh Jul 04 '18 at 15:35
  • So you know the issue is nothing to do with your server side code. `console.log()` everywhere in your javascript. Check if the `stripeTokenHandler` function is being called, check if your event listener is firing (I suspect not). – Joe Jul 04 '18 at 19:27

0 Answers0