How to use Headless OTP APIs on Shopify store

Overview

The security of customer accounts and transactions is critical in the fast-paced world of e-commerce. Implementing One-Time Password (OTP) verification is an effective way to improve security and protect sensitive information. We will walk you through the process of enabling OTP verification on your Shopify store in this API guide.

Shopify is a popular e-commerce platform known for its scalability and flexibility, making it an excellent choice for businesses of all sizes. You can add an extra layer of security to user accounts, checkout processes, and more by integrating OTP verification into your Shopify store.

This Step-by-Step guide gives instructions on how to use headless OTP APIs on your Shopify store using the miniOrange OTP Login application.

Download Plugin

Pricing Plans

Pre-requisite: Shopify OTP Login Application

To use headless OTP APIs, you will need to install the miniOrange OTP Login Application on your store.

Check out our video, to know more about how Single-Sign-On works in Shopify.

Configuration Steps

Step by Step Guide to Integrate OTP verification on your Shopify Store

Step 1: Create Authentication Header

To use our challenge and validate Rest APIs, you must first set the authorization headers necessary to ensure that the request is made by a valid user.
The following values must be specified in the HTTP Request Header. This will be the same for OTP requests and OTP validation calls.

Attribute	Description
Customer-Key	Your customer key.
Timestamp	The time in milliseconds when the request is being made.
Authorization	Sha 512 Hash Value consisting of the customer key, current timestamp and, API key.

SAMPLE CODE:

JAVA

/* JSON Object format for challenge API request */
    {
    /* You can get customer Key and customer Api Key from
        https://login.xecurify.com/moas/customerconfigurations*/
        String customerKey = "<YOUR_CUSTOMER_KEY>";
        String apiKey = "<YOUR_API_KEY>";
        /* Current time in milliseconds since midnight, January 1, 1970 UTC. */
        String currentTimeInMillis = String.valueOf(System.currentTimeMillis());
        /* Creating the Hash using SHA-512 algorithm (Apache Shiro library) */
        String stringToHash = customerKey + currentTimeInMillis + apiKey;
        String hashValue = new Sha512Hash(stringToHash).toHex().toLowerCase();
        HttpPost postRequest = new HttpPost("");
        /* Setting the Authorization Header values */
        postRequest.setHeader("Customer-Key", customerKey);
        postRequest.setHeader("Timestamp", currentTimeInMillis);
        postRequest.setHeader("Authorization", hashValue)
    }

PHP

/* JSON Object format for challenge API request */
    {
      /* You can get customer Key and customer Api Key from
        https://login.xecurify.com/moas/customerconfigurations*/
        $customerKey = "<YOUR_CUSTOMER_KEY>";
        $apiKey = "<YOUR_API_KEY>";
        /* Current time in milliseconds since midnight, January 1, 1970 UTC. */
        $currentTimeInMillis = round(microtime(true) * 1000);
        /* Creating the Hash using SHA-512 algorithm */
        $stringToHash = $customerKey . number_format ( $currentTimeInMillis, 0, '', '' ) .
        $apiKey;
        $hashValue = hash("sha512", $stringToHash);
        /* Add $customerKeyHeader,$timestampHeader and $authorizationHeader in the
       HTTP header */
        $customerKeyHeader = "Customer-Key: " . $customerKey;
        $timestampHeader = "Timestamp: " . number_format ( $currentTimeInMillis, 0, '', ''
        );
        $authorizationHeader = "Authorization: " . $hashValue;
    }

Step 2: OTP Generation / Challenge REST API

You need to make an HTTP GET request to our OTP generation / Challenge Rest API to be able to generate OTP for the phone number/email. Our Challenge Rest API accepts the following request parameters:
OTP Generation Endpoint: https://store.xecurify.com/moas/rest/shopify/api/auth/headless/otprequest

Request Parameters:

Attribute	Description
shop	Your shopify store domain (myshopify) on which the miniOrange OTP Login/Register app is installed.
to	The email address or phone number where you would like us to send OTP. Note: The value provided here must be present in your Shopify customer list
action	Write action type as "login"

JSON Response

The following is the JSON Response generated by the Generate Rest API.

/* JSON Response Object for Generation Request */
    {
        "responseType": "CHALLENGE",
        "phoneDelivery":{
            "contact": null,
            "sendStatus": null,
            "sendTime": null
        },
        "customerID": "5745403199697",
        "txId":"<UNIQUE_TRANSACTION_ID>",
        "emailDelivery": {
            "contact": "<EMAIL_ADDRESS_OTP_WAS_SENT_TO>", 
            "sendStatus": "SUCCESS",
            "sendTime": "09-05-2023 05:22:37"
        },
        "authType": "EMAIL",    
        "message": "The OTP has been sent to ixxxxxxxxxxxa@xxxxxxxx.com. 
        Please enter the OTP you received to Validate.",
        "status": "SUCCESS"
    }

Attribute	Description
txId	This is the transaction ID for your generation request. You will need to save this value in the session. This will need to be sent in the validation API.
authType	The authentication method. In this case, it’s Email
responseType	This shows the type of response i.e. Response for Challenge request or Validate request. Valid values: CHALLENGE
phoneDelivery	The phone delivery status. It is provided in case authentication is done through mobile.
contact	The phone number OTP was sent to i.e. mobile.
sendStatus	The status of sending the above contact. Valid values: SUCCESS, FAILED, ERROR
sendTime	Timestamp showing the time of sending.
message	An additional message showing the overall status of the request.
status	Overall status of the challenge/validation request. Valid values: SUCCESS, FAILED, ERROR

Step 3: OTP Validation / Verify Challenge REST API

To validate an OTP, you need to make an HTTP GET request to our Validate Rest API. Our Validate Rest API accepts the following request parameters:
Our validate API is: https://store.xecurify.com/moas/rest/shopify/api/auth/headless/otpverify

Request Parameters:

Attribute	Description
txId	The transaction ID for which the request was generated. This is sent as a response parameter in the Generate API.
shop	Your shopify store domain (myshopify) on which the miniOrange OTP Login/Register app is installed.
to	The email address or phone number where you would like us to send OTP.
otp	OTP received on your mobile/email.

JSON Response

The following is the JSON Response generated by the Validate Rest API.


    /* JSON Response Object for Validation Request */
    {
        txId: "<UNIQUE_TRANSACTION_ID>"
        responseType: "VALIDATE"
        status: "SUCCESS"
        message: "Successfully Validated"
    }

Attribute	Description
txId	This is the transaction ID for your generation request.
responseType	This shows the type of response i.e. Response for Generate request or Validate request. Valid values: VALIDATE
status	Overall status of the generation/validation request. Valid values: SUCCESS, ERROR, FAILED.
message	An additional message showing the overall status of the request.

In this comprehensive guide, we have explored the vital world of OTP (One-Time Password) verification and how it can be seamlessly integrated into your Shopify store to enhance security and protect sensitive customer data. We have covered the essential concepts, benefits, and step-by-step instructions for implementing OTP verification on your Shopify Store using the "miniOrange OTP Login" application.

Get in Touch

Please reach out to us at shopifysupport@xecurify.com, and our team will assist you with setting up the Shopify Inventory Sync application. Our team will help you to select the best suitable solution/plan as per your requirement.

Contents