Integration of Google Pay(Tez) in Freshmenu.

Sreekanth Kumar
Sep 3, 2018 · 3 min read

With the payments through UPI(Unified Payments Interface) becoming so pervasive in India and Google coming up with google pay, we were one of the first company to integrate google pay and payment through UPI in our website and mobile apps.

When we first launched Google Pay payment in our website, it was done through user’s VPA(VIRTUAL PAYMENT ADDRESS). Later on, we changed this to phone number as lot of users are not aware of VPA and it will be easier for the user to enter his phone number rather than VPA. Then we had a good traction of 50% increase in the usage of Google Pay payment while placing the order. We have also done Google Pay deep integration for andriod mobile users by which users are navigated to the app directly without the intervention of the form to enter his/her phone number and make payment. We have made use of PaymentRequest API to implement this feature in mobile site.

Now 93% of our UPI payments are done through Google Pay. We even partnered with google for offers on Freshmenu orders.

Here is how we integrated Google Pay(previously known as Google Tez) payment through phone number in Freshmenu website:-

Step1:

We take phone number of the user through the client(website/apps) and send it to backend server. Here we store the order(cart) information and assign a transaction id to it and then Google Pay API is called with the data of transaction id and other corresponding merchant details to create a collect request in Google Pay.

Freshmenu checkout-payment page

Based on whether the user’s phone number is linked to Google Pay or not, API returns success/failure. If the API return success, Google Pay sends a payment request to the user from which he/she can make the payment for the Freshmenu order in the google pay app.

Payment request sent to Google pay

And a timer is shown on client side based on the response, until the user makes the payment in Google Pay app.

Flow(focussed on successful transaction):

Step2:

Client will poll Google Pay API every 5 seconds with the transaction id created, to check the status of the transaction. Three cases of response and timeout case are handled on the UI.

  1. Pending: Continue to show the timer.
  2. Failure: User may decline the request and website UI will be updated accordingly by navigating user back to the payment options section.
  3. Success: If Google Pay API returns success, the payment status is cross checked with the bank partner from backend with respect to the transaction id and the response is sent to client accordingly.
  4. Timeout: Close the timer and navigate to payments section with feedback to the user.

If the payment is success, the order will be created and the user is redirected to the track order page.

It was really a good journey for us going from a online food ordering company to being featured at “Google for India 2018” event.

Authors:

Srikanth Kumar (Senior Software Engineer at Freshmenu)

RadhaMohan (Lead Engineer at Freshmenu)

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade