Laravel 9 Stripe Payment Gateway Integration Example

Stripe payment gateway integration in laravel 9; Through this tutorial, i am going to show you how to integrate stripe payment geteway in laravel 9 apps.

In this tutorial, i will use jQuery, ajax and stripe javascript library for payment deduction in laravel 9 app. And will call ajax request to deduct payment and store payment information into database in laravel 9 app.

Laravel 9 Stripe Payment Gateway Integration Example

Use the below given steps to implement stripe payment gateway in laravel 9 apps:

  • Step 1 – Installing Laravel 9 Application
  • Step 2 – Create account in Stripe and generate key and secret
  • Step 3 – Install Stripe package And Configure
  • Step 4 – Database and Stripe Key Configuration
  • Step 5 – Creating Payment Model & Migration
  • Step 6 – Create Routes
  • Step 7 – Creating Stripe Controller
  • Step 8 – Create Directory and Blade View
    • Create Directory Name Stripe
    • Create Stripe Payment Blade View
  • Step 9 – Start Development Server
  • Step 10 – Run This App On Browser

Step 1 – Installing Laravel 9 Application

In step 1, open your terminal and navigate to your local web server directory using the following command:

//for windows user
cd xampp/htdocs

//for ubuntu user
cd var/www/html

Then install laravel latest application using the following command:

composer create-project --prefer-dist laravel/laravel blog

Step 2 – Create account in Stripe and generate key and secret

In step 2, Create stripe account. Then generate key and secret.

Step 3 – Install Stripe package And Configure

In step 3, open terminal and run the following command on it to install stripe packate in laravel app:

composer require cartalyst/stripe-laravel

Then configure stripe package in app.php, which is located inside config directory:

'providers' => [
 ..........
 Cartalyst\Stripe\Laravel\StripeServiceProvider::class 
],
 
'aliases' => [
 ..........
 'Stripe' => Cartalyst\Stripe\Laravel\Facades\Stripe::class 
], 

Step 4 – Database and Stripe Key Configuration

In step 4, open your downloaded laravel app into any text editor. Then find .env file and configure database detail and stripe key and secret like following:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=db name
DB_USERNAME=db user name
DB_PASSWORD=db password

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 5 – Creating Payment Model & Migration

In step 5, run the following command on terminal to create model and migration file by using the following command:

php artisan make:model Payment -m

The above command will create two files into your laravel stripe payment gateway integration tutorial app, which is located inside the following locations:

  • /app/Models/Payment.php
  • /database/migrations/create_payments_table.php

So, find create_payments_table.php file inside /database/migrations/ directory. Then open this file and add the following code into function up() on this file:

    public function up()
    {
        Schema::create('payments', function (Blueprint $table) {
            $table->id();
            $table->string('s_payment_id'); // stripe payment id
            $table->string('user_id');
            $table->string('product_id');
            $table->string('amount');
            $table->timestamps();
        });
    }

Now, open again your terminal and type the following command on cmd to create tables into your selected database:

php artisan migrate

Step 6 – Create Routes

In step 6, open your web.php file, which is located inside routes directory. Then add the following routes into web.php file:

use App\Http\Controllers\StripeController;

Route::get('stripe', [StripeController::class, 'index']);
Route::post('payment-process', [StripeController::class, 'process']);

Step 7 – Creating Stripe Controller

In step 7, create stripe payment controller by using the following command:

php artisan make:controller StripeController

The above command will create StripeController.php file, which is located inside /app/Http/Controllers/ directory.

So open StripeController.php file and add the following code into it:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use App\Models\Payment;

use Stripe;

class StripeController extends Controller
{
     public function index()
	 {
	   return view('stripe.index');
	 }

	public function process(Request $request)
    {
  
        $stripe = Stripe::charges()->create([
            'source' => $request->get('tokenId'),
            'currency' => 'USD',
            'amount' => $request->get('amount') * 100
        ]);
  
        return $stripe;
    }
}

Step 8 – Create Directory and Blade View

In step 8, create the following directory and blade view file.

  • create directory name stripe inside resources/views directory.
  • Create Payment Blade View name index.blade.php inside resources/views/stripe directory. Then add the following code into it:
<!DOCTYPE html>
<html>
   <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Laravel 9 Stripe Payment Gateway Integration Example - LaraTutorials.com</title>
      <meta name="csrf-token" content="{{ csrf_token() }}">
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
      <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
      <style>
         .container{
         padding: 0.5%;
         } 
      </style>
   </head>
   <body>
      <div class="container">
         <div class="row">
            <div class="col-md-12 mt-2 mb-2">
               <h3 class="text-center">Laravel 9 Stripe Payment Gateway Integration Example Tutorial</h3><hr>
            </div>            
            <div class="col-md-12 mt-2 mb-2">
               <pre id="res_token"></pre>
            </div>
         </div>
         <div class="row">
            <div class="col-md-4">
               <button class="btn btn-primary btn-block" onclick="stripePay(10)">Pay $10</button>
            </div>
            <div class="col-md-4">
               <button class="btn btn-success btn-block" onclick="stripePay(50)">Pay $50</button>
            </div>
            <div class="col-md-4">
               <button class="btn btn-info btn-block" onclick="stripePay(100)">Pay $100</button>
            </div>
         </div>
      </div>
<script src = "https://checkout.stripe.com/checkout.js" > </script> 
<script type = "text/javascript">
    $(document).ready(function() {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
    });

function stripePay(amount) {
    var handler = StripeCheckout.configure({
        key: 'pk_test_5f6jfFP2ZV5U9TXQYG0vtqFJ00eFVWNoRX', // your publisher key id
        locale: 'auto',
        token: function(token) {
            // You can access the token ID with `token.id`.
            // Get the token ID to your server-side code for use.
            console.log('Token Created!!');
            console.log(token)
            $('#res_token').html(JSON.stringify(token));
            $.ajax({
                url: '{{ url("payment-process") }}',
                method: 'post',
                data: {
                    tokenId: token.id,
                    amount: amount
                },
                success: (response) => {
                    console.log(response)
                },
                error: (error) => {
                    console.log(error);
                    alert('Oops! Something went wrong')
                }
            })
        }
    });
    handler.open({
        name: 'Demo Site',
        description: '2 widgets',
        amount: amount * 100
    });
} 
</script>
   </body>
</html>

Step 9 – Start Development Server

Finally, open your command prompt again and run the following command to start development server for your laravel stripe payment gateway integration example:

php artisan serve

Step 10 – Run This App On Browser

In step 10, open your browser and fire the following url into your browser:

http://127.0.0.1:8000/stripe

Testing Card Credential

 Card No : 4242 4242 4242 4242
 Month : any future month
 Year : any future Year
 CVV : 123

Recommended Laravel Tutorials

Be First to Comment

Leave a Reply

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