Laravel 9 stripe payment gateway integration; In this tutorial, we will learn how to integrate stripe payment gateway in laravel 9 app.
Stripe was founded in 2011 and is a payment gateway that lets you accept credit card payments (in person or online) by transferring money between your merchant account and a payment processor. This is done using a physical credit card terminal or an online processor
Stripe Payment Gateway Integration In Laravel 9
Follow the following steps to integrate stripe payment gateway in laravel 9 apps:
- Step 1: Install Laravel 9 App
- Step 2: Install stripe Package
- Step 3: Stripe Configuration
- Step 4: Make Route
- Step 5: Create Controller
- Step 6: Create Blade View file
- Step 7: Run Development Server
Step 1: Install Laravel 9 App
In this step, execute the following command on the terminal to install Laravel 9 app. So, Open the command prompt and execute the following command:
composer create-project --prefer-dist laravel/laravel blog
Step 2: Install Stripe package
In this step, install stripe package in laravel app by executing the following command on terminal:
composer require stripe/stripe-php
After that, you need to set stripe key and secret. So, visit on Stripe website and create development stripe account. And get key and secret from stripe.com.
Step 3: Stripe Configuration
Now open .evn file and set the secret credential provided by a stripe payment gateway
STRIPE_KEY=pk_test_xxxxxxxxxxxxxxxxxxx
STRIPE_SECRET=sk_test_xxxxxxxxxxxxxx
Next step, you need to set up the Stripe API key, to do this open or create the config/services.php file, and add or update the 'stripe' array:
'stripe' => [
'secret' => env('STRIPE_SECRET'),
],
Step 4: Make Route
In this step, open web.php file, which is placed inside routes directory. And add the following routes into it:
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\StripeController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('stripe', [StripeController::class, 'stripe']);
Route::post('stripe', [StripeController::class, 'stripePost'])->name('stripe.post');
Step 5: Create Controller
In this step, execute the following command on terminal to create the controller name StripeController:
php artisan make:controller StripeController
Then visit app/Http/Controllers/ directory and open StripeController. Then add the following code into StripeController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Session;
use Stripe;
class StripeController extends Controller
{
/**
* success response method.
*
* @return \Illuminate\Http\Response
*/
public function stripe()
{
return view('stripe');
}
/**
* success response method.
*
* @return \Illuminate\Http\Response
*/
public function stripePost(Request $request)
{
Stripe\Stripe::setApiKey(env('STRIPE_SECRET'));
Stripe\Charge::create ([
"amount" => 100 * 100,
"currency" => "usd",
"source" => $request->stripeToken,
"description" => "Test payment from tutsmake.com."
]);
Session::flash('success', 'Payment successful!');
return back();
}
}
Step 6: Create Blade View file
In this step, Visit app/resources/views/ and create one blade view file name stripe.blade.php. Then add the following code into Stripe.blade.php file:
<!DOCTYPE html>
<html>
<head>
<title>Laravel 9 Stripe Payment Gateway Integration Tutorial Example - Tutsmake.com</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<style type="text/css">
.panel-title {
display: inline;
font-weight: bold;
}
.display-table {
display: table;
}
.display-tr {
display: table-row;
}
.display-td {
display: table-cell;
vertical-align: middle;
width: 61%;
}
</style>
</head>
<body>
<div class="container">
<h1>Laravel 9 Stripe Payment Gateway Integration Example <br/> Tutsmake.com</h1>
<div class="row">
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-default credit-card-box">
<div class="panel-heading display-table" >
<div class="row display-tr" >
<h3 class="panel-title display-td" >Payment Details</h3>
<div class="display-td" >
<img class="img-responsive pull-right" src="http://i76.imgup.net/accepted_c22e0.png">
</div>
</div>
</div>
<div class="panel-body">
@if (Session::has('success'))
<div class="alert alert-success text-center">
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
<p>{{ Session::get('success') }}</p>
</div>
@endif
<form
role="form"
action="{{ route('stripe.post') }}"
method="post"
class="require-validation"
data-cc-on-file="false"
data-stripe-publishable-key="{{ env('STRIPE_KEY') }}"
id="payment-form">
@csrf
<div class='form-row row'>
<div class='col-xs-12 form-group required'>
<label class='control-label'>Name on Card</label> <input
class='form-control' size='4' type='text'>
</div>
</div>
<div class='form-row row'>
<div class='col-xs-12 form-group card required'>
<label class='control-label'>Card Number</label> <input
autocomplete='off' class='form-control card-number' size='20'
type='text'>
</div>
</div>
<div class='form-row row'>
<div class='col-xs-12 col-md-4 form-group cvc required'>
<label class='control-label'>CVC</label> <input autocomplete='off'
class='form-control card-cvc' placeholder='ex. 311' size='4'
type='text'>
</div>
<div class='col-xs-12 col-md-4 form-group expiration required'>
<label class='control-label'>Expiration Month</label> <input
class='form-control card-expiry-month' placeholder='MM' size='2'
type='text'>
</div>
<div class='col-xs-12 col-md-4 form-group expiration required'>
<label class='control-label'>Expiration Year</label> <input
class='form-control card-expiry-year' placeholder='YYYY' size='4'
type='text'>
</div>
</div>
<div class='form-row row'>
<div class='col-md-12 error form-group hide'>
<div class='alert-danger alert'>Please correct the errors and try
again.</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<button class="btn btn-primary btn-lg btn-block" type="submit">Pay Now ($100)</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
<script type="text/javascript">
$(function() {
var $form = $(".require-validation");
$('form.require-validation').bind('submit', function(e) {
var $form = $(".require-validation"),
inputSelector = ['input[type=email]', 'input[type=password]',
'input[type=text]', 'input[type=file]',
'textarea'].join(', '),
$inputs = $form.find('.required').find(inputSelector),
$errorMessage = $form.find('div.error'),
valid = true;
$errorMessage.addClass('hide');
$('.has-error').removeClass('has-error');
$inputs.each(function(i, el) {
var $input = $(el);
if ($input.val() === '') {
$input.parent().addClass('has-error');
$errorMessage.removeClass('hide');
e.preventDefault();
}
});
if (!$form.data('cc-on-file')) {
e.preventDefault();
Stripe.setPublishableKey($form.data('stripe-publishable-key'));
Stripe.createToken({
number: $('.card-number').val(),
cvc: $('.card-cvc').val(),
exp_month: $('.card-expiry-month').val(),
exp_year: $('.card-expiry-year').val()
}, stripeResponseHandler);
}
});
function stripeResponseHandler(status, response) {
if (response.error) {
$('.error')
.removeClass('hide')
.find('.alert')
.text(response.error.message);
} else {
/* token contains id, last4, and card type */
var token = response['id'];
$form.find('input[type=text]').empty();
$form.append("<input type='hidden' name='stripeToken' value='" + token + "'/>");
$form.get(0).submit();
}
}
});
</script>
</html>
Step 7: Run Development Server
In this step, execute the PHP artisan serve command on the terminal to start the development server:
php artisan serve
If you want to run the project diffrent port so use this below command
php artisan serve --port=8080
Now, open a browser and hit the following URL on it:
http://localhost:8000/stripe
Testing Card Credential
Card No : 4242424242424242
Month : any future month
Year : any future Year
CVV : 123
Conclusion
Stripe payment gateway integration in laravel 9 tutorial, we have learned how to integrate the stripe payment gateway in laravel 9 app.
Recommended Laravel Tutorials
If you have any questions or thoughts to share, use the comment form below to reach us.
