Laravel 7/6 Stripe Payment Gateway Integration Example

Laravel 7/6 stripe payment gateway integration example. This tutorial illustrates to you, how you can integrate stripe payment gateway in your laravel application.

In this tutorial, we’ll discuss step by step how to integrate stripe payment gateway in our laravel version based project. 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.

Laravel 7/6 Stripe Payment Gateway Integration

Just follow the below steps and you can easily integrate stripe payment gateway in your laravel based application:

Step 1: Install Laravel Fresh Setup
Step 2: Install stripe Package
Step 3: Set Secret Credential
Step 4: Make Route
Step 5: Create Controller
Step 6: Create Blade View file
Step 7: Run Development Server

Step 1: Install Laravel Fresh Project

We need to install Laravel fresh application using below command, Open your command prompt and run the below command :

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

Step 2: Install Stripe package

composer require cartalyst/stripe-laravel

After that, we need to register the provider and aliases. Go to the app/config/app.php and put the below lines here :

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

Step 3: Set Secret Credential

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

 Route::get('stripe', 'StripeController@index');
 Route::post('store', 'StripeController@store');

Step 5: Create Controller

In this step, we need to create the controller name StripeController using the below command.

php artisan make:controller StripeController

Go to app/Http/Controller/StripeController and put the below code :

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Redirect,Response,Stripe;

class StripeController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        return view('stripe');
    }


    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {

        $stripe = Stripe::charges()->create([
            'source' => $request->get('tokenId'),
            'currency' => 'USD',
            'amount' => $request->get('amount') * 100
        ]);

        return $stripe;
    }
}

Step 6: Create Blade View file

We need to create blade views file, Go to app/resources/views/ and create one file name stripe.blade.php. After that you can put your publisher key id in views file:

<!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">
  <meta name="csrf-token" content="{{ csrf_token() }}">
  <title>Laravel Stripe Payment Gateway Integration - Tutsmake.com</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <style>
   .container{
    padding: 0.5%;
   }
</style>
</head>
<body>
  <div class="container">

   <div class="row">
      <div class="col-md-12"><pre id="token_response"></pre></div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <button class="btn btn-primary btn-block" onclick="pay(10)">Pay $10</button>
      </div>
      <div class="col-md-4">
        <button class="btn btn-success btn-block" onclick="pay(50)">Pay $50</button>
      </div>
      <div class="col-md-4">
        <button class="btn btn-info btn-block" onclick="pay(100)">Pay $100</button>
      </div>
    </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<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 pay(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)
        $('#token_response').html(JSON.stringify(token));

        $.ajax({
          url: '{{ url("store") }}',
          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>

In this tutorial, we will use the Striped JS library to create a token. When the user hits any of the above buttons our payment () function is called and here we will initialize the striped object and open the stripe popup. Popup will be the default popup of Stripe. You do not have to worry about verification and the security bar will handle everything for you.

Step 7: Run Development Server

In this step, we will use the PHP artisan serve command. It will start your server locally

php artisan serve

If you want to run the project diffrent port so use this below command 

php artisan serve --port=8080

Now we are ready to run our example so run bellow command to quick run.

http://localhost:8000/stripe
Or direct hit in your browser
http://localhost/blog/public/stripe

Testing Card Credential

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

Conclusion

In this tutorial, We have successfully integrated the stripe payment gateway in laravel Application. Our examples run quickly.

Subscribe to Blog via Email