2023
Implement RazorPay Payment Gateway in Asp.net MVC
135
RazorPay
Razor Pay is a payment gateway that supports payments internationally. In this article we will by following all steps that we need to implement razorpay payment gateway in asp.net mvc.
So first of all you have to create one new asp.net mvc project and after creating the project you have to go to
Project -> Manage Nuget Packages
Now search for RazorPay and install version 3.0.0 like you can see in the image below
Adding Client Key and Client Secret
Now we have to get the RazorPay credentials which basically includes the client key and client secret and we will add those in the web.config. You can see in the below image we have added the two keys
You can also copy the keys from below
<?xml version="1.0"?>
<!--
For more information on how to configure your ASP.NET application, please visit
https://go.microsoft.com/fwlink/?LinkId=301880
-->
<configuration>
<appSettings>
<add key="webpages:Version" value="3.0.0.0"/>
<add key="webpages:Enabled" value="false"/>
<add key="ClientValidationEnabled" value="true"/>
<add key="UnobtrusiveJavaScriptEnabled" value="true"/>
<add key="RazorPaykey" value="rzp_test_f10WA$GHIkQgII"/>
<add key="RazorPaySecret" value="pCNbV6YvWNDPkSxVGH2ODLjr"/>
</appSettings>
<!--
For a description of web.config changes see http://go.microsoft.com/fwlink/?LinkId=235367.
The following attributes can be set on the <httpRuntime> tag.
<system.Web>
<httpRuntime targetFramework="4.6" />
</system.Web>
-->
<system.web>
<compilation debug="true" targetFramework="4.6"/>
<httpRuntime targetFramework="4.6"/>
</system.web>
<runtime>
<assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
<dependentAssembly>
<assemblyIdentity name="Antlr3.Runtime" publicKeyToken="eb42632606e9261f"/>
<bindingRedirect oldVersion="0.0.0.0-3.5.0.2" newVersion="3.5.0.2"/>
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed"/>
<bindingRedirect oldVersion="0.0.0.0-12.0.0.0" newVersion="12.0.0.0"/>
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.Optimization" publicKeyToken="31bf3856ad364e35"/>
<bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="1.1.0.0"/>
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="WebGrease" publicKeyToken="31bf3856ad364e35"/>
<bindingRedirect oldVersion="0.0.0.0-1.6.5135.21930" newVersion="1.6.5135.21930"/>
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.Helpers" publicKeyToken="31bf3856ad364e35"/>
<bindingRedirect oldVersion="1.0.0.0-3.0.0.0" newVersion="3.0.0.0"/>
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.WebPages" publicKeyToken="31bf3856ad364e35"/>
<bindingRedirect oldVersion="1.0.0.0-3.0.0.0" newVersion="3.0.0.0"/>
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.Mvc" publicKeyToken="31bf3856ad364e35"/>
<bindingRedirect oldVersion="1.0.0.0-5.2.7.0" newVersion="5.2.7.0"/>
</dependentAssembly>
</assemblyBinding>
</runtime>
<system.codedom>
<compilers>
<compiler language="c#;cs;csharp" extension=".cs" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.CSharpCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=2.0.1.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:default /nowarn:1659;1699;1701"/>
<compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.VBCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=2.0.1.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:default /nowarn:41008 /define:_MYTYPE=\"Web\" /optionInfer+"/>
</compilers>
</system.codedom>
</configuration>Add New Controller and Views for Capturing Payment
Now , the next step we have to follow is add new controller and views for our razorpay integration.
For Demo purpose we will add one textbox to capture amount and a payment button on Index.cshtml
Copy the code for the view from here
@{
ViewBag.Title = "Home Page";
}
<div class="jumbotron">
<h1>ASP.NET</h1>
<p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
<p><a href="https://asp.net" class="btn btn-primary btn-lg">Learn more »</a></p>
</div>
<form action="/Home/Initiatepayment"><input type="text" id="amount" name="amount" />
<input type="submit" value="Pay Now"/></form>
Now ,on the home controller we will add new action IntitiatePayment which will accept amount as the parameter
using Razorpay.Api;
Add this namespace in the controller where we want to integrate RazorPay Payments
Copy the following code from here and paste on controller . Here in the InitiatePayment method we are creating a new order with the amount we have entered on the screen and returning to the payment view .
using Razorpay.Api;
using System;
using System.Collections.Generic;
using System.Configuration;
using System.Linq;
using System.Security.Cryptography;
using System.Text;
using System.Web;
using System.Web.Mvc;
namespace RazorPay.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult InitiatePayment(string amount)
{
var key = ConfigurationManager.AppSettings["RazorPaykey"].ToString();
var secret = ConfigurationManager.AppSettings["RazorPaySecret"].ToString();
RazorpayClient client = new RazorpayClient(key, secret);
Dictionary<string, object> options = new Dictionary<string, object>();
options.Add("amount", Convert.ToDecimal(amount) * 100);
options.Add("currency", "USD");
Order order = client.Order.Create(options);
ViewBag.orderId = order["id"].ToString();
return View("Payment");
}
public ActionResult Payment(string razorpay_payment_id,string razorpay_order_id,string razorpay_signature)
{
Dictionary<string, string> attributes = new Dictionary<string, string>();
attributes.Add("razorpay_payment_id", razorpay_payment_id);
attributes.Add("razorpay_order_id", razorpay_order_id);
attributes.Add("razorpay_signature", razorpay_signature);
try
{
Utils.verifyPaymentSignature(attributes);
return View("PaymentSuccess");
}
catch(Exception ex)
{
return View("PaymentFailure");
}
return View();
}
}
}Add new View "Payment" for checkout
Now you can copy the following code for the view and create a new view with name "Payment" or can change the name accordingly
@{
ViewBag.Title = "Home Page";
}
<form action="/Home/payment" method="post" name="razorpayForm">
<input id="razorpay_payment_id" type="hidden" name="razorpay_payment_id" />
<input id="razorpay_order_id" type="hidden" name="razorpay_order_id" />
<input id="razorpay_signature" type="hidden" name="razorpay_signature" />
</form>
<body>
<button id="rzp-button1" style="margin-top:20px">Checkout with Razorpay</button>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>
var orderId = "@ViewBag.orderId"
var options = {
"name": "Code2night",
"description": "Payment using Razorpay",
"order_id": orderId,
"image": "https://www.code2night.com/Content/code2night-C.png",
"prefill": {
"name": "Code2night",
"email": "code2nightblog@gmail.com",
"contact": "+919999999888",
},
"notes": {
"address": "Test Payment"
},
"theme": {
"color": "#3399cc"
}
}
// Boolean whether to show image inside a white frame. (default: true)
options.theme.image_padding = false;
options.handler = function (response) {
document.getElementById('razorpay_payment_id').value = response.razorpay_payment_id;
document.getElementById('razorpay_order_id').value = orderId;
document.getElementById('razorpay_signature').value = response.razorpay_signature;
document.razorpayForm.submit();
};
options.modal = {
ondismiss: function () {
console.log("This code runs when the popup is closed");
},
// Boolean indicating whether pressing escape key
// should close the checkout form. (default: true)
escape: true,
// Boolean indicating whether clicking translucent blank
// space outside checkout form should close the form. (default: false)
backdropclose: false
};
var rzp = new Razorpay(options);
document.getElementById('rzp-button1').onclick = function (e) {
rzp.open();
e.preventDefault();
}
</script>
</body>Here, ViewBag.OrderId is a important part as that orderId is what is returned from controller and needed for further steps of payments. Now run the application 
Here we will enter the amount which we want the user to pay and click on "Pay Now" button. The form will be posted to Intiate payment action and one orderid will be generated which you can see in below image
Now you will see following page 
Here click on the button Checkout and following popup will open
Click on card button in the popup and it will show following screen
For test purpose you can enter following card details
Card Number- 5267 3181 8797 5449 Expiry- 01/25 (Any future date) CVV - 567 (any random three digit)
After adding the following details, now click on Pay Now.
Since it is a sandbox test, you will see following screen for success or failure of transaction. You can do success payment by clicking on success button. Click on Success
Now you can get the payment id and payment signature at
Here you can save your payment details. Now you can check on your razorpay dashboard for new transaction . Click on the transactions tab and you will see all transactions here
Here you can see the first transaction that we have just completed
Now you can also click on the Orders tab to check the order status.Check out the first transaction here
So, this is how you can create and complete payment and this is how we can Implement RazorPay Payment Gateway in Asp.net MVC.
