Laravel stripe checkout.js not loaded

I'm developing a webapp that allows one-off payments. I'm using Laravel with Cashier for that.

I'm displaying a number of products with the typical Stripe pay button. Clicking on it should display the checkout.js form but this is not happening.

The product view is basically a loop that displays the Stripe button:

<div class="row">
 @foreach ($products as $product)
    <form action="" method="POST">
    
     <div class="col-sm-5 col-md-5">
       <div class="thumbnail">
         <div class="caption">
           <h3></h3>
           <p></p>
           <p>Buy for $</p>
           <p>
           <script src="http://ift.tt/1doUtf9" class="stripe-button"                       
            data-key=""
            data-amount=""
            data-name="Stripe.com"
            data-description="Widget"
            data-locale="auto"
            data-currency="usd">
           </script>
          </p>
        </div>
       </div>
      </div>
     </form>
   @endforeach
   </div><!--row-->

When I click on the button, the Stripe pay overlay does not load.

The relevant routes are

Route::get('product', 'ProductController@index')->name('product');
Route::post('pay/{product}', 'OrderController@payWithStripe')->name('pay');

The Controller file is as follows:

public function payWithStripe(Request $request, Product $product) {
  $token = $request->input('_token'); 
  return $this->chargeCustomer($product->id, $product->price, $product->name, $token);
}

public function chargeCustomer($product_id, $product_price, $product_name, $token) {
    \Stripe\Stripe::setApiKey(env('STRIPE_SECRET'));

    if (!$this->isStripeCustomer()) {
       $customer = $this->createStripeCustomer($token);
    }
    else {
       $customer = \Stripe\Customer::retrieve(access()->user()->stripe_id);
    }
 return $this->createStripeCharge($product_id, $product_price, $product_name, $customer);
 }

 public function createStripeCharge($product_id, $product_price, $product_name, $customer) {
   try {
       $charge = \Stripe\Charge::create(array(
           "amount" => $product_price,
           "currency" => "usd",
           "customer" => $customer->id,
           "description" => $product_name
        ));
    } catch(\Stripe\Error\Card $e) {
       return redirect()
           ->route('frontend.user.product')
           ->with('error', 'Your credit card was been declined. Please try again or contact us.');
    }
        return $this->postStoreOrder($product_id);
  }


 public function createStripeCustomer($token) {
    \Stripe\Stripe::setApiKey(env('STRIPE_SECRET'));

    $customer = \Stripe\Customer::create(array(
        "description" => access()->user()->email,
        "source" => $token
    ));

    access()->user()->stripe_id = $customer->id;
    access()->user()->save();

    return $customer;
 }

 public function isStripeCustomer() {
    return access()->user() && \App\Models\Access\User\User::where('id', access()->user()->id)->whereNotNull('stripe_id')->first();
 }

The issues are:

• 1) The overlay payment (where VISA card details should be entered) is not displayed
• 2) In the chargeCustomer function, the customer is not generated in Stripe. I get an error "No such token: xxxxxxxx". Printing it out is definitely the hidden token (checked from the pageview). The problem might be related to the _token, where I see that stripeToken should be used. However stripeToken always returns null.

via Chebli Mohamed