Home > Article > Backend Development > How to implement real-time registration verification function using php+ajax

How to implement real-time registration verification function using php+ajax

墨辰丷Original: 2018-06-01 17:07:381790browse

When we register on the website, when entering the user name, we must first perform non-refresh verification. This article mainly introduces the php ajax registration real-time verification function in detail. Interested friends can refer to it

The real-time verification technology of ajax is very mature. On some standardized websites, if there is a template for registration verification, it will definitely involve the non-refresh verification of ajax, which is great in the user registration experience. Compared with a verification mode that cannot be connected to the background without refreshing in time, and has to go back to refresh, this is a very unfriendly experience for users.

The ajax mode is a requirement for almost all site applications. As a front-end non-refresh verification, ajax can be used in combination with all back-end languages, such as asp ajax, php ajax, .net ajax, etc. and other combinations, the main explanation here is the registration verification of php ajax.

The following verification is a complete example. When we register on the website and enter the user name, we must first perform a non-refresh verification and verify whether there is data with the same name in the background database. If it exists, There will be no refresh prompt indicating that the username has been occupied. A total of four files are involved here.

ajax.js:This is the core file of ajax technology. It mainly displays verification prompts from time to time. This file usually does not need to be modified, and only requires front-end calls.

var xmlHttp
function showHint(str)
{
if (str.length==0)
 { 
 document.getElementById("txtHint").innerHTML=""
 return
 }
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 } 
xmlHttp.onreadystatechange=stateChanged 

var geturl="conn.php?q="+str
//sid是增加一个随机数 防止页面启用缓存技术·
geturl=geturl+"&sid="+Math.random()
geturl=encodeURI(geturl);
geturl=encodeURI(geturl); 
xmlHttp.open("GET",geturl,true)
xmlHttp.send(null)
} 
function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
 } 
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 // Internet Explorer
 try
 {
 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
 }
 catch (e)
 {
 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 }
return xmlHttp;
}

conn.php:This is the configuration file of the website. You must configure your local mysql username and password. You need to configure the connection between PHP and the database. You can refer to the article on PHP MYSQL database connection. In addition, the received data needs to be processed for real-time display. If there are multiple files to be verified, just perform multiple acceptance and verification here.

<?php
$q=$_GET["q"];
$q = urldecode($q);

if (strlen($q) > 0)
{
 $conn = @mysql_connect("localhost","root","1010") or die ("MySql连接错误");
 mysql_select_db("xin",$conn);
 mysql_query("set names &#39;utf8&#39;");
 
 $sql = "SELECT username FROM message WHERE username = &#39;$q&#39;";
 $query = mysql_query($sql);
 @$row = mysql_fetch_array($query);
 
 if(!empty($row[&#39;username&#39;]))
 {
 $response = "<font color=red>已经被注册！</font>";
 }else
 {
 $response = "<font color=blue>恭喜！可以注册！</font>";
 }
 
 echo $response;
}

?>

index.html:This is the front-end file. This file is relatively simpler. It calls The processing file of ajax.js will submit the file to be submitted for non-refresh verification to conn.php and the background for connection.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="ajax.js"></script> 
</head>
<body bgcolor="#999999">
<center>
<form> 
<table>
 <tr>
 <td>用户名：</td>
 <td><input type="text" id="txt1" onKeyUp="showHint(this.value)"></td>
 </tr>
 <tr align="center">
 <td colspan="2"><span id="txtHint"></span></td>
 </tr>
</table>
</form>
</center>
</body>
</html>

Library.txt:This is the SQL database file. Just import this file into the mysql database. .

DROP DATABASE IF EXISTS `xin`;
CREATE DATABASE `xin` /*!40100 DEFAULT CHARACTER SET utf8 */;
USE `xin`;


CREATE TABLE `message` (
 `id` int(11) NOT NULL auto_increment,
 `username` varchar(20) default NULL,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;

Save these files in the root directory where you can run PHP files. The test URL is localhost/index.html. The following is Package the entire set of downloaded files and try to modify it to the registration module you need, such as adding a password, name, etc.

Summary: The above is the entire content of this article, I hope it will be helpful to everyone's study.

Related recommendations:

phpDetailed explanation of using regular expressions to obtain the URL in a string

php Detailed explanation of examples of preg_match matching languages in different countries

Detailed explanation of examples of PHP ajax implementation of login background verification

The above is the detailed content of How to implement real-time registration verification function using php+ajax. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：PHP+Ajax implements real-time verification function of verification codeNext article：PHP+Ajax implements real-time verification function of verification code

See more

How to implement real-time registration verification function using php+ajax

Related articles