This tutorial is about Razorpay Payment Gateway Integration – Laravel 5.x you will get the step by step with screenshot all the steps to integrate this in your project.
About Razorpay:- Its offers a fast, affordable and secure way for merchants, schools, eCommerce and other companies to accept payments online. It’s available only for Indian businesses.
Follow the below steps to integrate Razorpay easily on the Laravel website.
Step 1. Install laravel application.
The initial step to begin
Please refer article for this > [How to install Laravel 5.X] for how to install Laravel
Step 2. Create account in Razorpay and generate key and secret
Go to RAZORPAY and signup with basic details step by step.
Run test mode as per the screenshot
Find key and secret from Razorpay account as per below screenshot.
Step 3. copy the credentials in .env file
Add these parameters in your env file
You need to add these parameters in your .env file and you will find this file in your root directory.
RAZORPAY_KEY=rzp_test_razor_key
RAZORPAY_SECRET=rzp_test_razor_secret
Note: For security, reason adds those credentials only in .env file.
Step 4. Install Razorpay package via composer
Install the package using composer in terminal
You need to run the below command for the install package in your terminal.
This command will update all the dependency of the package according to your version if you needed any in your project setup.
composer require razorpay/razorpay
Step 5. Create Route and Controller with actions and view
Create MVC files
Now, we are going to run the below command to generate a controller file.
php artisan make:controller RazorpayController
This generated file should look like this below code.
<?php
# Copy the code from below to that controller file located at app/Http/Controllers/RazorpayController.php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
//use Razorpay\Api\Api;
class RazorpayController extends Controller {
public function pay() {
return view('pay');
}
public function dopayment(Request $request) {
//Input items of form
$input = $request->all();
// Please check browser console.
print_r($input);
exit;
}
}
Include RajorPay js inside the layout file head section as below. the path will be [resources/views/layouts/app.blade.php]
<head>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<!-- Include whatever JQuery which you are using -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<!-- Other js and css scripts -->
</head>
Now we will create a view file at this path [resources/views/] folder with [pay.blade.php] file name.
@extends('layouts.app')
@section('content')
<div id="main-content">
<div class="container clear">
<div class="panel-body" style="border: 1px solid #ddd;padding: 10px;background: #eee;width: 30%;">
<form id="rzp-footer-form" action="{!!route('dopayment')!!}" method="POST" style="width: 100%; text-align: center" >
@csrf
<a href="https://amzn.to/2RlZQXk">
<img src="https://images-na.ssl-images-amazon.com/images/I/31tPpWGQWzL.jpg" />
</a>
<br/>
<p><br/>Price: 2,475 INR </p>
<input type="hidden" name="amount" id="amount" value="2475"/>
<div class="pay">
<button class="razorpay-payment-button btn filled small" id="paybtn" type="button">Pay with Razorpay</button>
</div>
</form>
<br/><br/>
<div id="paymentDetail" style="display: none">
<center>
<div>paymentID: <span id="paymentID"></span></div>
<div>paymentDate: <span id="paymentDate"></span></div>
</center>
</div>
</div>
</div>
</div>
<script>
$('#rzp-footer-form').submit(function (e) {
var button = $(this).find('button');
var parent = $(this);
button.attr('disabled', 'true').html('Please Wait...');
$.ajax({
method: 'get',
url: this.action,
data: $(this).serialize(),
complete: function (r) {
console.log('complete');
console.log(r);
}
})
return false;
})
</script>
<script>
function padStart(str) {
return ('0' + str).slice(-2)
}
function demoSuccessHandler(transaction) {
// You can write success code here. If you want to store some data in database.
$("#paymentDetail").removeAttr('style');
$('#paymentID').text(transaction.razorpay_payment_id);
var paymentDate = new Date();
$('#paymentDate').text(
padStart(paymentDate.getDate()) + '.' + padStart(paymentDate.getMonth() + 1) + '.' + paymentDate.getFullYear() + ' ' + padStart(paymentDate.getHours()) + ':' + padStart(paymentDate.getMinutes())
);
$.ajax({
method: 'post',
url: "{!!route('dopayment')!!}",
data: {
"_token": "{{ csrf_token() }}",
"razorpay_payment_id": transaction.razorpay_payment_id
},
complete: function (r) {
console.log('complete');
console.log(r);
}
})
}
</script>
<script>
var options = {
key: "{{ env('RAZORPAY_KEY') }}",
amount: '247500',
name: 'CodesCompanion',
description: 'TVS Keyboard',
image: 'https://i.imgur.com/n5tjHFD.png',
handler: demoSuccessHandler
}
</script>
<script>
window.r = new Razorpay(options);
document.getElementById('paybtn').onclick = function () {
r.open()
}
</script>
@endsection
Note: Make sure jQuery added in a head section at the layout file.
Now you have to add routes in your routes/web.php file.
// route for to show payment form using get method
Route::get('pay', 'RazorpayController@pay')->name('pay');
// route for make payment request using post method
Route::post('dopayment', 'RazorpayController@dopayment')->name('dopayment');
Final Step 6. Run demo
You just need to serve the laravel now
At this stage, we are almost done with the integration and now we will un Laravel application using below command.
php artisan serve
Now in the browser manually type below URL.
http://127.0.0.1/pay
Use below test credentials to run the demo
Card : 4111 1111 1111 1111
Expiry Date : 22/95
CCV : 123
Card Holder Name : Your Name
You are done now you have successfully integrated Razorpay Payment Gateway Integration – Laravel 5.x.
If you need the whole laravel setup then I have also attached code in Github and attached GitHub link below.
it is not working
Can you please let us know what is not working?
it’s working
yeah you did not tell us how to acces key and how to send request to razorpay server
You have to insert access key and secret key in .env file. Regarding sending a request on server ‘RazorPay’ handles itself with js “https://checkout.razorpay.com/v1/checkout.js”. Which you need to set in ‘resources/views/layouts/app.blade.php’ at head section. checkout github demo for more info
use Razorpay\Api\Api;
you assign but not use
Yes you are right! Thanks for taking my attention on that. I corrected it by commenting that line.
Thank you its working perfect.
Can anyone give me a heads up on how to store payment id and payment date in the database?
Need help. I am new in Laravel.
this function is not working i have copied all the files and just loaded the files it says 404 not found
Please send me your contact details in email so we can check your code and help you out.
I am very much grateful for your efforts put on this article.
This article is updated very informative and translucent. Can I expect you may post this type of another article in near future?
King regards,
Abildgaard Duke
Yes sure sir.
Just want to say your article is as amazing. The clearness
in your post is simply cool and i could assume you’re an expert on this subject.
Well with your permission allow me to grab your RSS feed to keep updated with forthcoming post.
Thanks a million and please keep up the enjoyable work.
Thank you so much !!
First time visiting your website, I really like your site!
Thank you so much !!
Saved as a favorite!, I enjoy your blog!
Thank you so much !!
Saved as a favorite!, I love it!
Thank you so much !!
Pingback: Pei payment gateway integration with PHP. pei.is - iceland.