In this article I will explain with an example, how to generate unique random OTP (One Time Password) in ASP.Net Core (.Net Core) Razor Pages.
OTPs or One Time Passwords are widely used by banks and other firms to validate the Mobile Numbers of their users. OTPs can be Alphanumeric as well as Numeric and generally have length between 5-10 characters.
The simplest example of an OTP is when you try to connect to a public Wi-Fi network, your mobile device receives an SMS containing a unique password and once you register with the correct password, the device gets connected to the network.
Index PageModel (Code-Behind)
The PageModel consists of following Handler methods.
Handler method for handling GET operation
This Handler method left empty as it is not required.
Handler method for handling POST operation
This Handler method gets called when Submit Button is clicked and it accepts selected values of DropDownList and RadioButtonList as parameters.
Note: The DropDownList value will be the length of OTP and RadioButtonList value will be the type of OTP i.e. Alphanumeric and Numeric.
The following three string variables are created:
capital_alphabets – For storing Upper Case Alphabets.
small_alphabets – For storing Lower Case Alphabets.
numbers – For storing 10 digits (0-9).
A variable is created with name characters which stores the value of numbers variable.
After that, it checks if the selected type of OTP is 1 which indicates that OTP must be Alphanumeric in nature. Inside this condition, the string variables i.e. capital_alphabets, small_alphabets and numbers are concatenated and stored into a characters variable.
Next, a FOR loop is executed for the selected length inside which a DO WHILE loop is used to avoid repetition of the characters.
Inside the DO WHILE loop, a random number is used to fetch the character from characters variable based on the type selected in the RadioButtonList.
Finally, the generated unique random OTP i.e. One Time Password is set into a
ViewData object.
public class IndexModel : PageModel
{
public void OnGet()
{
}
public void OnPostGenerateOTP(int length, string type)
{
string alphabets = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
string small_alphabets = "abcdefghijklmnopqrstuvwxyz";
string numbers = "1234567890";
string characters = numbers;
if (type == "1")
{
characters += alphabets + small_alphabets + numbers;
}
string otp = string.Empty;
for (int i = 0; i < length; i++)
{
string character = string.Empty;
do
{
int index = new Random().Next(0,characters.Length);
character = characters.ToCharArray()[index].ToString();
} while (otp.IndexOf(character) != -1);
otp += character;
}
ViewData["Message"] = otp;
}
}
Razor Page (HTML)
HTML Markup
Inside the Razor Page, the ASP.Net TagHelpers is inherited.
The Form consist of an HTML Table which consists of an HTML SELECT (DropDownList) and two RadioButton elements and a Submit button.
The Submit Button has been set with the POST Handler method using the asp-page-handler attribute.
Note: In the Razor PageModel, the Handler method name is OnPostGenerateOTP but here it will be specified as GenerateOTP when calling from the Razor HTML Page.
@page
@model Generate_OTP_Core_Razor.Pages.IndexModel
@addTagHelper*,Microsoft.AspNetCore.Mvc.TagHelpers
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<form method="post">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<select name="length">
<option value="">Please select</option>
<option value="5">5</option>
<option value="8">8</option>
<option value="10">10</option>
</select>
</td>
<td>
<input name="type" type="radio" value="1" />Alphanumeric
<input name="type" type="radio" value="2" />Numeric
</td>
<td><input type="submit" value="Genderate OTP" asp-page-handler="GenerateOTP" /></td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td colspan="3">
OTP:@ViewData["Message"]
</td>
</tr>
</table>
</form>
</body>
</html>
Screenshot
![ASP.Net Core Razor Pages: Generate Unique Random OTP (One Time Password)]()
Demos
Downloads
