Integrate Sign in with Phone on your website

Introduction

Try Sign In Demo

Sign in with Phone is a phone verification plugin that works on the frontend, similar to Sign in with Gmail. It simplifies global phone number verification by using OTP/pass code. Sign in with Phone eliminates the need for complex telecom registration and SMS API Gateway integration for each country.

To seamlessly integrate the plugin into your website, follow the instructions provided below.

Frequently Asked Questions

Very easy to integrate
Cost effective and reliable service

Save DLT registration cost (~ 5800 INR)
No need for sender Id registration
No need for SMS template approval
No SMS gateway required

Step 1. Get Sign in button code

Admin Dashboard

To verify phone numbers on your website, you need to first log-in to the admin dashboard.
Once logged in, you can copy the HTML code for the sign-in button and paste it onto your website page. This code displays the phone verification button and also includes a JavaScript listener function called phoneEmailListener. This function is triggered once a user's phone number has been successfully verified.

Tips:

From the admin dashboard, you can customize the sign-in button to align with your brand by adjusting attributes such as button color and text etc.
If you are using JavaScript frameworks like ReactJS, Angular JS or similar, please translate the provided HTML/JS code to suit your framework's syntax and conventions.

Step 2. Get verified phone number

Upon successful verification of the phone number, we return user JSON file path in user_json_url variable.You can find this variable in phoneEmailListener function as explained in step 1.
Please utilize this user_json_url to retrieve the verified phone number in your backend technologies like Python, Node.js, PHP, Java etc. This backend based JSON retrieval approach safeguards against potential security issues arising from frontend tampering.

Example JSON

user_json_url : https://user.phone.email/user_session_id.json

{
    "user_country_code" : "+1",
    "user_phone_number" : "91254323NN"
}

Below is an example code demonstrating how to read a JSON file in various popular backend programming languages such as Node JS, Python, PHP, Java, etc.

 <?php
// Assuming $user_json_url contains the URL path
$json_data = file_get_contents($user_json_url);
$data = json_decode($json_data, true);

$user_country_code = $data['user_country_code'];
$user_phone_number = $data['user_phone_number'];
// Now you can use $user_country_code and $user_phone_number as needed
?>

const https = require('https');
// URL of the JSON file
const user_json_url = "URL_OF_YOUR_JSON_FILE";

https.get(user_json_url, (res) => {
  let data = '';

  // A chunk of data has been received.
  res.on('data', (chunk) => {
    data += chunk;
  });

  // The whole response has been received.
  res.on('end', () => {
    const jsonData = JSON.parse(data);

    // Access user_country_code and user_phone_number
    const user_country_code = jsonData.user_country_code;
    const user_phone_number = jsonData.user_phone_number;

    console.log("User Country Code:", user_country_code);
    console.log("User Phone Number:", user_phone_number);
  });

}).on("error", (err) => {
  console.log("Error: " + err.message);
});

import urllib.request
import json

# URL of the JSON file
user_json_url = "URL_OF_YOUR_JSON_FILE"

# Read JSON data from the URL
with urllib.request.urlopen(user_json_url) as url:
    data = json.loads(url.read().decode())

# Access user_country_code and user_phone_number
user_country_code = data["user_country_code"]
user_phone_number = data["user_phone_number"]

print("User Country Code:", user_country_code)
print("User Phone Number:", user_phone_number)

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.URL;
import org.json.JSONObject;

public class ReadJsonFromUrl {
    public static void main(String[] args) {
        String userJsonUrl = "URL_OF_YOUR_JSON_FILE";
        try {
            URL url = new URL(userJsonUrl);
            HttpURLConnection connection = (HttpURLConnection) url.openConnection();
            connection.setRequestMethod("GET");
            connection.connect();

            // Read JSON response
            BufferedReader reader = new BufferedReader(new InputStreamReader(connection.getInputStream()));
            StringBuilder response = new StringBuilder();
            String line;
            while ((line = reader.readLine()) != null) {
                response.append(line);
            }
            reader.close();

            // Parse JSON response
            JSONObject jsonObject = new JSONObject(response.toString());
            String userCountryCode = jsonObject.getString("user_country_code");
            String userPhoneNumber = jsonObject.getString("user_phone_number");

            System.out.println("User Country Code: " + userCountryCode);
            System.out.println("User Phone Number: " + userPhoneNumber);

            connection.disconnect();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

Step 3. Logout

To handle logout simply destroy any session you have created during login process.

Should you encounter any technical challenges during the integration process, please don't hesitate to reach out to us for assistance.