Laravel 8 Stripe Payment Gateway Integration Example

Laravel 8 Stripe Payment Gateway Integration Example

Laravel 8 stripe payment gateway integration tutorial example; this tutorial will show you how to integrate stripe payment gateway in laravel 8 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 is the most popular payment gateway which is integrated into many websites, Stripe payment is easy to integrate and use. Stripe is a very simple and most powerful and flexible tool. So in this tutorial, you will learn step by step how to integrate stripe payment gateway in laravel 8 app.

Stripe Payment Gateway Integration In Laravel 8

  • Step 1: Install Laravel 8 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 8 App

In this step, execute the following command on terminal to install Laravel 8 app. So, Open 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 8 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 8 - 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 8 - 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 terminal to start 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 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 8 tutorial, you have learn how to integrate the stripe payment gateway in laravel 8 app.

Recommended Laravel Posts

If you have any questions or thoughts to share, use the comment form below to reach us.

AuthorAdmin

Greetings, I'm Devendra Dode, a full-stack developer, entrepreneur, and the proud owner of Tutsmake.com. My passion lies in crafting informative tutorials and offering valuable tips to assist fellow developers on their coding journey. Within my content, I cover a spectrum of technologies, including PHP, Python, JavaScript, jQuery, Laravel, Livewire, CodeIgniter, Node.js, Express.js, Vue.js, Angular.js, React.js, MySQL, MongoDB, REST APIs, Windows, XAMPP, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL, and Bootstrap. Whether you're starting out or looking for advanced examples, I provide step-by-step guides and practical demonstrations to make your learning experience seamless. Let's explore the diverse realms of coding together.

2 replies to Laravel 8 Stripe Payment Gateway Integration Example

  1. Great tutorial. It helps me a lot . Thank You Devendra Dode.

    • Glad to be able to help you @Sayan Ghosh

Leave a Reply

Your email address will not be published. Required fields are marked *