Laravel stripe integration - laravel

Question

I setup future payment in my laravel app with stripe. However, after following stripe integration from stripe official doc I encountered this error response.
Here's my script:
<script>
var stripeSetupIntent = function (stripe, setupIntent) {
const email = document.getElementById("stripe-email").value;
stripe.confirmCardSetup(setupIntent.client_secret,
{
payment_method: {
card: card,
billing_details: {
name: email,
},
},
}
).then(function(result) {
if (result.error) {
// Display error.message in your UI.
console.log('Error: ', result.error)
// var displayError = document.getElementById("card-errors");
// displayError.textContent = result.error.message;
} else {
console.log('Sucess')
// The setup has succeeded. Display a success message.
}
});
};
var getSetupIntent = function(stripe) {
axios.post('/api/createcustomerinstripe').then(function (response) {
console.log('getSetupIntent: ', response.data.setupIntent)
stripeSetupIntent(stripe, response.data.setupIntent)
})
};
$(document).ready(function () {
let stripe = null;
//get stripe public key
axios.get('/api/stripe-key').then(function (response) {
stripe = Stripe(response.data.publicKey);
const elements = stripe.elements();
const card = elements.create('card');
card.mount('#card-element');
})
var button = document.getElementById("savecard");
button.addEventListener("click", function(event) {
event.preventDefault();
// changeLoadingState(true);
getSetupIntent(stripe)
});
})
</script>
Backend code:
Controller:
public function getStripeKey()
{
$publicKey = env('STRIPE_KEY');
$data = [
'message' => 'Stripe key successfully retrieved.',
'publicKey' => $publicKey
];
return response()->json($data, 200, [], JSON_PRETTY_PRINT);
}
public function CreateCustomerInStripe()
{
Stripe::setApiKey(env('STRIPE_SECRET'));
$customer = Customer::create([
'email' => auth()->user()->email
]);
$setupIntent = SetupIntent::create([
'customer' => $customer->id
]);
$data = [
'message' => 'A new SetupIntent was created.',
'setupIntent' => $setupIntent
];
return response()->json($data, 200, [], JSON_PRETTY_PRINT);
}
Backend code web:
Route::get('stripe-key', 'api\StripePaymentController#getStripeKey')->name('stripe.key');
Route::post('createcustomerinstripe', 'api\StripePaymentController#CreateCustomerInStripe')->name('createcustomerinstripe');
I use the stripe documentation here https://stripe.com/docs/payments/save-and-reuse#web-test-integration
stripe version:
<script src="https://js.stripe.com/v3/"></script>
laravel version:
https://laravel.com/docs/7.x/billing