In this video we are going to integration paytm payment gateway in our website step by step . This video is very simple video of integrating paytm payment . Receive Payment on Website | Simplest way of Integration Paytm Payment Integration in Hindi



Integrating Razor pay:


First of all  signup on paytm dashboard website and get your key details.


Add these dependency in pom.xml



package com.paytm.integration.config;

public class AppConfig {
    public static final String MID="RHLBnF070397707073";
    public static final String MKEY="BXWmXtYo858BTG";
    public static final String WEBSITE="WEBSTAGING";

package com.paytm.integration.controllers;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

public class PageController {

    public String homePage() {
        System.out.println("Request for home page");
        return "home";
    public String aboutPage() {
        System.out.println("Request for about page");
        return "about";


package com.paytm.integration.controllers;

import com.paytm.integration.config.AppConfig;
import org.json.JSONObject;
import org.springframework.http.HttpEntity;
import org.springframework.http.HttpHeaders;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.client.RestTemplate;

import java.util.Map;
import java.util.Random;

public class PaymentController {

    Random random = new Random();

    public Map<String, Object> startPayment(
            @RequestBody Map<String, Object> data
    ) {

        String orderId = "ORDER" + random.nextInt(10000000);

        //param created
        JSONObject paytmParams = new JSONObject();

        //body information
        JSONObject body = new JSONObject();
        body.put("requestType", "Payment");
        body.put("mid", AppConfig.MID);
        body.put("websiteName", AppConfig.WEBSITE);
        body.put("orderId", orderId);
        body.put("callbackUrl", "http://localhost:8081/payment-success");

        JSONObject txnAmount = new JSONObject();
        txnAmount.put("value", data.get("amount"));
        txnAmount.put("currency", "INR");

        JSONObject userInfo = new JSONObject();
        userInfo.put("custId", "CUST_001");

        body.put("txnAmount", txnAmount);
        body.put("userInfo", userInfo);

        String responseData = "";
        ResponseEntity<Map> response = null;

        try {

            String checksum = PaytmChecksum.generateSignature(body.toString(), AppConfig.MKEY);

            JSONObject head = new JSONObject();
            head.put("signature", checksum);

            paytmParams.put("body", body);
            paytmParams.put("head", head);

            String post_data = paytmParams.toString();

            /* for Staging */
            URL url = new URL("" + AppConfig.MID + "&orderId=" + orderId + "");

            HttpHeaders headers = new HttpHeaders();
            HttpEntity<Map<String, Object>> httpEntity = new HttpEntity<>(paytmParams.toMap(), headers);

            //calling api
            RestTemplate restTemplate = new RestTemplate();
            response = restTemplate.postForEntity(url.toString(), httpEntity, Map.class);


        } catch (Exception e) {

        Map body1 = response.getBody();
        body1.put("orderId", orderId);
        body1.put("amount", txnAmount.get("value"));
        return body1;

    public void capturePayment(){
        //get the data from client

        //verify the payment

        //database mein bhi update kar do ki payment ho chuka hai...

        //allow user to access the service



<!doctype html>
<html lang="en">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap demo</title>
    <link href="[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
        body {
            background: #e2e2e2;

<div class="container">
    <div class="row m-5">
        <div class="col-md-6 offset-md-3">
            <div class="card border-0 shadow">
                <div class="card-body">
                    <h3>Donate to Free Education</h3>

                    <div class="m-2">
                        <label for="user_name">Your name</label>
                        <input id="user_name" type="text" class="form-control">
                    <div class="m-2">
                        <label for="user_phone">Your phone</label>
                        <input id="user_phone" type="text" class="form-control">
                    <div class="m-2">
                        <label for="user_amount">Amount</label>
                        <input id="user_amount" type="text" class="form-control">
                    <div class="container text-center">
                        <button class="btn btn-primary btn-sm" onclick="startPayment()">Proceed to pay</button>


<script src="[email protected]/dist/js/bootstrap.bundle.min.js"


    function initiateClientModule(data) {

        const script = document.createElement("script");
        script.src = ``;
        script.crossOrigin = `anonymous`;
        script.onload = () => {

            var config = {
                "root": "",
                "flow": "DEFAULT",
                "data": {
                    "orderId": data.orderId, /* update order id */
                    "token": data.body.txnToken, /* update token value */
                    "tokenType": "TXN_TOKEN",
                    "amount": data.amount/* update amount */

                "merchant": {

                    mid: "RHLBnF070327707073",
                    redirect: false

                "handler": {
                    "notifyMerchant": function (eventName, data) {
                        console.log("notifyMerchant handler function called");
                        console.log("eventName => ", eventName);
                        console.log("data => ", data);
                    "transactionStatus": function (data) {
                        console.log("transaction completed")

                        if (data.STATUS = "TXN_FAILURE") {
                        } else if (data.STATUS == 'TXN_SUCCESS') {

                            //capture api with data : call kar lo
                        } else {
                            alert("Something wend wrong while payment contact to admin!!")




            if (window.Paytm && window.Paytm.CheckoutJS) {
                window.Paytm.CheckoutJS.onLoad(function excecuteAfterCompleteLoad() {
                    // initialze configuration using init method
                    window.Paytm.CheckoutJS.init(config).then(function onSuccess() {
                        // after successfully updating configuration, invoke JS Checkout
                    }).catch(function onError(error) {
                        console.log("error => ", error);




    //start payment function
    async function startPayment() {
        //call api to start payment
        const amount = document.querySelector("#user_amount").value

        const baseUrl = "http://localhost:8081"

        const response = await fetch(`${baseUrl}/payment/start`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            body: JSON.stringify({'amount': amount})

        response.json().then(data => {
            //order is generated successfully


        }).catch(error => {
            alert("error in initiating payment")



Note: I used spring boot for backend and simple javascript for backend . These technologies is of my choice you can you any technology if you got the concept.