Skip to content
This repository was archived by the owner on Jul 4, 2024. It is now read-only.

Commit 253d807

Browse files
soulsam480soulsam480
authored
Readme update
1 parent 28e5d6b commit 253d807

File tree

1 file changed

+225
-1
lines changed

1 file changed

+225
-1
lines changed

‎README.md

Lines changed: 225 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,225 @@
1-
@netlify lambda function for serverless @paytm payments integration
1+
## Paytm-Netlify-Lambda 🚀
2+
3+
Paytm payments integration for serverless JAMstack websites using netlify lambda functions. This repo will save you from the nightmare of setting up a serverless payment integration from scratch.
4+
5+
🚀 It's live [here](https://tiaamo.com)
6+
7+
### 📑 Table of Contents
8+
9+
* 🔰 [Getting Started](#getting-started)
10+
* 📐 [Setup](#setup)
11+
* 🌱 [Basic Setup](#basic-setup)
12+
* 🔥 [Usage with Firebase](#usage-with-firebase)
13+
* 🗜 [Integration](#integration)
14+
* 📓 [Notes](#notes)
15+
* 🤓 [How it Works ?](#how-it-works)
16+
* 🌋 [Errors](#errors)
17+
* 📔 [References](#references)
18+
19+
### Getting Started
20+
21+
To get started clone this repo.
22+
```
23+
git clone git@github.com:soulsam480/paytm-netlify-lambda.git
24+
25+
cd paytm-netlify-lambda
26+
27+
npm install
28+
```
29+
To serve the lambda functions locally we can run
30+
```
31+
npm run start
32+
```
33+
But before that we have to setup the functions otherwise there will be errors!!
34+
35+
### Setup
36+
37+
Open the repo in your favorite text-editor and the file structure will be like this
38+
39+
* config
40+
* dist
41+
* src
42+
* cred
43+
* paytm
44+
* checksum.js
45+
* crypt.js
46+
* paytm_config.js
47+
* paytmChecksum.js
48+
* payConf.js
49+
* payment.js
50+
51+
Webpack cofig sits inside the config folder. All our functions will be build into the dist folder. So it's good if we don't touch that folder.
52+
53+
#### Basic Setup
54+
55+
Open paytm_config.js inside the paytm folder.
56+
```
57+
module.exports = {
58+
paytm_config: {
59+
PAYTM_ENVIRONMENT: "TEST", //possible values: TEST | PROD
60+
MID: " Your MID", // Get it From https://dashboard.paytm.com/next/apikeys use Test id for test purpose and Production id for Production Purpose
61+
WEBSITE: "WEBSTAGING", // USE WEBSTAGING for testing, You Will get it for Production here https://dashboard.paytm.com/next/apikeys
62+
CHANNEL_ID: "WEB", // Use WEB for Desktop Website and WAP for Mobile Website
63+
INDUSTRY_TYPE_ID: "Retail", // Use Retail for Testing, For Production You Can Get it from here https://dashboard.paytm.com/next/apikeys
64+
MERCHANT_KEY: " Your MERCHANT_KEY", // Get it From https://dashboard.paytm.com/next/apikeys use Test key for test purpose and Production key for Production Purpose
65+
CALLBACK_URL:
66+
"https://your_unique_site_id.netlify.app/.netlify/functions/payConf", // Modify and Use this url for verifying payment
67+
},
68+
};
69+
```
70+
Change the MID and Merchant Key to your paytm merchant account. The callback url will be updated after you have deployed these functions to netlify. So we will leave it as it is. Again if you wish to change the parameters for production build, the respective fields will be changed with the production credentials.
71+
72+
If you don't wish to use firebase for order validation and confirmation, you can stop here and remove firebase completely from the project. If you wish to use, let's move in to the next step.
73+
74+
#### Usage with Firebase
75+
We will use [firebase-admin](npmjs.com/package/firebase-admin) sdk for nodejs to access admin privilages. With firebase admin running on server we can perform CRUD operations on realtime database easily.
76+
77+
To setup admin sdk you need a firebase service account. To get yourself one open you firebase admin dashboard and then project settings > service accounts. Create one for your project and download the credentials in json. Then open src/cred/authKey.js . Add the credentials in their respective places.
78+
```
79+
module.exports = {
80+
authKey: {
81+
type: "service_account",
82+
project_id: "Your Project id",
83+
private_key_id: " Your PRIVATE_KEY_ID",
84+
private_key: "Your PRIVATE_KEY",
85+
client_email: "Your client email",
86+
client_id: "Your client id",
87+
auth_uri: "your auth uri",
88+
token_uri: "auth token uri",
89+
auth_provider_x509_cert_url: "cert url provider",
90+
client_x509_cert_url: " your CERT_URL",
91+
},
92+
};
93+
```
94+
95+
Then open src/payConf.js and add your database URL. With this the setup is complete.
96+
97+
After each successful payment firebase-admin will create an order inside
98+
```
99+
Orders/dd_mm_yy(current date)/orderId
100+
```
101+
this could be further used to verify an proceed with the payment. This is the only advantage of using firebase inside this project. If you don't wish to verify your orders, you can drop firebase completely and move on with the basic approach.
102+
103+
As the setup is complete you can deploy this project to netlify by pushing the code into an it repo. The instruction on how to deploy from a git repo is [here](https://docs.netlify.com/configure-builds/get-started/#basic-build-settings)
104+
105+
There are two methods to integrate these functions to your project.
106+
107+
### Integration
108+
109+
110+
This method makes a POST request to the api and creates and submits the form clent-side in browser.
111+
Let's move further for a good explanation.
112+
113+
To make API calls you have to pass these parameters inside the body of your post request. Here is an example using axios.
114+
```
115+
axios({
116+
method: "post",
117+
url:
118+
"https://your_unique_netliy_appname.netlify.app/.netlify/functions/payment",
119+
data: {
120+
amount: payment amount, //must be an integer Mandatory
121+
name: "customer_name", // _ is allowed.no space allowed inbetween. ex. Sambit_sahoo
122+
email: "customer_email", //valid customer email
123+
orderid: "Order_id", //mandatory.no space allowed inbetween ex. OD123231 or OD_12324
124+
mobile: "customer_mobileno",
125+
},
126+
headers: {
127+
"Content-Type": "application/json",
128+
},
129+
})
130+
.then(async (res) => {
131+
console.log(res);
132+
const params = res.data.params;
133+
params["CHECKSUMHASH"] = res.data.checksum;
134+
135+
//Here the helper function post.js creates the from api response and submits.
136+
137+
post({
138+
action: res.data.action,
139+
target: "_self",
140+
params: params,
141+
});
142+
})
143+
.catch((err) => {
144+
window.alert(err);
145+
});
146+
147+
```
148+
Here is the helper function which creates and submits the form client side inside browser.
149+
150+
```
151+
//This plugin is used to perform form action request from jsvascript.
152+
//This is derived from https://github.com/jisaacks/react-post/blob/master/src/post.js
153+
function isDate(val) {
154+
// Cross realm comptatible
155+
return Object.prototype.toString.call(val) === "[object Date]";
156+
}
157+
158+
function isObj(val) {
159+
return typeof val === "object";
160+
}
161+
162+
export function stringifyValue(val) {
163+
if (isObj(val) && !isDate(val)) {
164+
return JSON.stringify(val);
165+
} else {
166+
return val;
167+
}
168+
}
169+
170+
function buildForm({ action, target, params }) {
171+
const form = document.createElement("form");
172+
form.setAttribute("method", "post");
173+
form.setAttribute("action", action);
174+
form.setAttribute("target", target);
175+
176+
Object.keys(params).forEach((key) => {
177+
const input = document.createElement("input");
178+
input.setAttribute("type", "hidden");
179+
input.setAttribute("name", key);
180+
input.setAttribute("value", stringifyValue(params[key]));
181+
form.appendChild(input);
182+
});
183+
184+
return form;
185+
}
186+
187+
export default function post(details) {
188+
const form = buildForm(details);
189+
console.log(form);
190+
document.body.appendChild(form);
191+
form.submit();
192+
form.remove();
193+
}
194+
```
195+
Again after a successful payment you will be redirected to the page sent from the payment confirmation function i.e. payConf.js.
196+
197+
To change your response URLs
198+
go to line 89 for payment success URL, line 93 and 96 for Failure URL.
199+
200+
### Notes
201+
This project is an wrapper and improvement over the project created by [Satyam](https://github.com/imlolman). You can find the github repo [here](https://github.com/imlolman/Paytm-Payment-Gateway-Integration-using-Google-Cloud-Function). He implemented this approach using firebase cloud functions.
202+
203+
#### How it Works
204+
[Netlify functions](https://docs.netlify.com/functions/overview/) are AWS lambda functions which return a callback for an API request. I originally intended to implement this approach without [experess.js](https://expressjs.com/). But I ran into many errors and couldn't figure a way out. So i went with the Express way 😂.
205+
206+
When you hit the payment endpoint with the data inside a POST request, it generates a checksum for the provided orderid using paytm's generate checksum logic. After successful generation it responds with the credentials for the payment page. The response from the promise by axios is used to create the HTML form by the elper function post.js and submitted immediately.
207+
208+
After Successful payment, your callback function which is src/payConf.js verifies the status of the transaction from paytm transaction status api through an unique signature. after successful verification, the callback function creates an order on your firebase database and responds with your payment succes page url.
209+
210+
#### Errors
211+
I have handled most of the errors 😌. Still there is always a bug 🐛. If you ran into any issues try using console.log() to find and fix the error by using google. If you don't find any way reach me [here](mailto:soulsam480@hotmail.com). I'll be happy to help 👏🏼👏🏼 !!
212+
#### References
213+
Links to some of the resources that helped me create this project.
214+
* [Satyam's Repo](https://github.com/imlolman/Paytm-Payment-Gateway-Integration-using-Google-Cloud-Function) 👏🏼
215+
* [His post on his approach](https://medium.com/imlolman/integrate-paytm-payment-gateway-for-static-hosted-website-using-google-cloud-function-4c78385cda9f) 👌🏼
216+
* [Netlify Lambda Repo](https://github.com/netlify/netlify-lambda) For improvements and bugs. 🐛
217+
* [Serverless HTTP](https://github.com/dougmoscrop/serverless-http) For more bugs 🐛🐛
218+
* [Netlify Functions](https://docs.netlify.com/functions/overview/) For reference 🎇
219+
* [Paytm Documentation](https://developer.paytm.com/docs/v1/payment-gateway/) For more reference 🎇🎇
220+
221+
I'm not good at writing documentations. So if i missed something and you ran into an unknown issue please reach me on
222+
223+
[mail](mailto:soulsam480@hotmail.com) 📧 / [twitter](https://twitter.com/sambitsahoojs) 🕊 / [instagram](https://instagram.com/sambitsahoo.js) 🖼
224+
225+
Thank You! ✌🏼

0 commit comments

Comments
 (0)