Skip to main content

Mobile SMS OTP

mobile otp sms

How to build SMS otp for verification in php

Today ,i am going to teach you something you cannot find easily on the web,which is sms otp. you can also learn email otp.You see that screenshot above? that's exactly what we are building,cool isn't it ?
OTP is an effective way of validating users. This type of validation is widely followed by the banking applications, e-commerce software, and many more verticals. In this tutorial, we are going to see how to implement OTP SMS mobile number verification using PHP,isn't that fun?!
There are various APIs available in the market for sending SMS via an application. In this code, I have used the Textlocal API for sending OTP SMS. Textlocal is one of the popular SMS services. It provides the SMS service for many programming languages. Download the API PHP class to integrate it into our application platform.
For verifying a mobile number by sending OTP SMS with the use of Textlocal API, we need to create a Textlocal account and login with to get the API key. This API key is used later while instantiating the API class for sending SMS.
In this example, we use two HTML forms. One is for getting the mobile number and the other is for getting the OTP. By submitting these forms, the AJAX request will be sent to access PHP to send OTP code and to validate it with PHP session data.

Getting the  Mobile Number to Send OTP

This is the landing page that will show a HTML form for getting user’s mobile number to be verified. On submitting the mobile number by clicking the send OTP button, an AJAX code will be executed to request PHP for sending OTP via SMS using the Textlocal API. 
</DOCTYPE html> 
<html>
<head>
<title>How to Implement OTP SMS Mobile Verification in PHP with TextLocal</title> 
<link href="style.css" type="text/css" rel="stylesheet" />
</head
<body>
<dv class="container"> 	
<div class="error"></div> 		

<form id="frm-mobile-verification">
<div class="form-heading">Mobile Number Verification</div> 		
	<div class="form-row"> 		
		<input type="number" id="mobile" class="form-input" 					placeholder="Enter the 10 digit mobile"> 
			</div> 		
	<input type="button" class="btnSubmit" value="Send OTP" 				onClick="sendOTP();">
 		</form>
 	</div> 
	<script
 src="jquery-3.2.1.min.js" type="text/javascript">
</script> 	<script
 src="verification.js">
</script> 
</body> 
</html>

HTML form to Submit OTP for Verification

This is another HTML form that will be loaded by AJAX after sending the OTP to the user’s mobile number. The user has to submit the received OTP via this form. The generated OTP code is stored in a PHP session variable.
This session data will be used for verifying the entered OTP is correct or not. 
<div class="error"></div>
<div class="success"></div>
<form id="frm-mobile-verification"> 	<div class="form-row">

jQuery AJAX Script for requesting OTP Sending and Verification code

This is the JavaScript file containing the functions for requesting OTP Sending and Verification PHP code via AJAX. Both of these functions sends the appropriate action parameter to execute suitable PHP code block. The sendOTP() method sends the mobile number and send_otp action params to the PHP file. Similarly, the verifyOTP() method sends the OTP code entered by the user with corresponding action parameter. 

function sendOTP() { 	$(".error").html("").hide();
var number = $("#mobile").val(); 
if (number.length == 10 && number != null)
{ 	
	var input = { 			"mobile_number" : number, 			"action" : "send_otp" 		};
 		$.ajax({ 			url : 'controller.php', 			type : 'POST', 			data : input, 			success : function(response) { 				$(".container").html(response);
 			}
 		});
 	}
{ 
		$(".error").html('Please enter a valid number!') 		$(".error").show(); 
	} 
}
 function verifyOTP()
 { 
	$(".error").html("").hide(); 
	$(".success").html("").hide();
 	var otp = $("#mobileOtp").val();
 	var input = { 		"otp" : otp, 		"action" : "verify_otp" 	};
 	if (otp.length == 6 && otp != null) { 		$.ajax({ 			url : 'controller.php', 			type : 'POST', 			dataType : "json", 			data : input, 			success : function(response) { 				$("." + response.type).html(response.message) 				$("." + response.type).show(); 	
		}, 	
		error : function() { 				alert("ss"); 	
		} 
		});
 	} 
else
 { 
		$(".error").html('You have entered wrong OTP.') 		$(".error").show(); 	} }

Controller.php

This is the PHP Controller class which is accessed via AJAX. The class constructor invokes the function for handling mobile verification actions based on the request sent via the AJAX call. This function processes sending OTP to a target mobile and validating OTP entered by the user.
<?php
session_start();
error_reporting(E_ALL & ~ E_NOTICE);
require ('textlocal.class.php');

class Controller
{
function __construct() {
$this->processMobileVerification();
}
{
switch ($_POST["action"]) {
case "send_otp":

$mobile_number = $_POST['mobile_number'];

$apiKey = urlencode('YOUR_API_KEY');
$Textlocal = new Textlocal(false, false, $apiKey);
$numbers = array( $mobile_number );
$sender = 'EVLEARNER';
$otp = rand(100000, 999999);
$_SESSION['session_otp'] = $otp;
$message = "Your One Time Password is " . $otp;
try{ $response = $Textlocal->sendSms($numbers, $message, $sender);
require_once ("verification-form.php");
exit();
}
catch(Exception $e)
{
die('Error: '.$e->getMessage());
}
break;
case "verify_otp": $otp = $_POST['otp'];
if ($otp == $_SESSION['session_otp']) { unset($_SESSION['session_otp']);
echo json_encode(array("type"=>"success", "message"=>"Your mobile number is verified!"));
}
else
{
echo json_encode(array("type"=>"error", "message"=>"Mobile number verification failed"));
}
break;
}
}
}
$controller = new Controller();
?>
Labels:

Comments

Post a Comment

Popular posts from this blog

Ecommerce single item cart with php checkoit

email otp sms How to create an ecommerce single item cart with checkout integrations Guys today i am going to teach you guys how to build an ecommerce site with checkout integration but only with a single product, you can add more to it So we are building it using my favorite PHP ,Ajax and JQuery. I have already created a simple shopping cart code in PHP with the product gallery.let's get this over with What are we building? I am not meant to show you this but i would to make you exited about it.And look at the cool checkout page and it really works!!. Single product UI with buy now and Checkout controls This is the code of the landing page created for this example. It includes PHP snippets at the beginning. After that, it has the HTML for displaying only one product tile to users. This tile has the “ Buy now ” button. On clicking it will show an HTML form to collect the customer details, name and email address. By submitting the customer details, it calls the ...
Post a Comment
Read more

Email OTP

email otp sms Email OTP Login with an OTP code is a secure method for the user authentication process. In this method, a one-time password is generated dynamically and sent to the user who attempts login. OTP can be sent to the user’s email or his mobile phone. When the user enters the OTP code then the application will authenticate the user via this code. In this tutorial, we are going to see an example to authenticate user login via an OTP code using email. You can check our mobile sms otp too!  In this example, when the registered user enters email to login, an OTP code is sent to the email address. Using this OTP code the user will be validated. Once the user uses this code then it will be invalid, meaning it cannot be used again. Also, this token will be valid for a day, then it will be expired. Login form with OTP The following code shows login form to the user to enter his email address. On entering email, it shows an input to enter the OTP code sent to his email addres...
Post a Comment
Read more

How to block user IP address from your website in PHP

how to block your website user using their ip address blocking users from your site There are many reasons you may need to block an IP address from visiting your website. For example, to prevent particular users doing malicious things with your website - trying to spam your web forms, or hack your shopping cart, etc. Using PHP, you can easily find your site visitors' website addresses and based on these addresses to redirect them to specific places on your site. If you use such IP ban protection on your website, you will also need to not only list individual addresses to be blocked but also IP masks and IP ranges. In this tutorial I would show you how you can do that.But,it would be manual .i'd talk about manual and automatic way to do it. Let's start! First, we will create an array to list all the IP addresses that we want to block. Besides single IP addresses, we will also use IP ranges such as 216.58.197.101-216.58.197.200 and IP masks 100.88.*.*. Here is the arr...
Post a Comment
Read more