如何验证用户名的唯一性

如何验证用户名的唯一性

创建一个ajax请求的步骤

本题考查的是ajax的应用，任何一个ajax的应用都会经历如下的流程：

1. 根据构造函数创建一个XMLHtttpRequest对象
2. 利用XMLHtttpRequest对象的open方法创建请求，设置请求方式、请求地址以及同步或异步
3. 调用XMLHtttpRequest对象的send方法发送请求
4. 使用XMLHtttpRequest对象的responseText或responseXML属性获取服务器响应数据
5. 调用XMLHtttpRequest对象的onreadystatechange事件监听XMLHtttpRequest对象的readyState属性值状态的变化
6. 处理服务器返回的结果

另外，需要了解的是，当前端界面需要从服务器获取数据的时候，其实就只要访问一个url地址，制定特定的参数即可。而服务器人员已经将此url地址对应的jsp或php开发好了。服务器开发人员开发好相关的接口之后，会提供一份接口文档，在接口文档中会详细的说明在需要什么数据的时候访问什么地址、传入什么参数等。

验证用户名唯一性步骤及源码

本文中分别以验证用户名和电话号码为例，分别发送get和post请求，并且分别返回字符串格式以及JSON格式。

操作步骤

1. 在form表单（action=""）中输入一个input标签（用来让用户输入用户名）以及一个空的span标签（用来显示用户名是否已经被使用）；
2. 在js中获取输入框，为其添加onblur事件，在获取输入框中的内容
3. 使用上面的ajax流程将输入框中的内容提交给服务器，由服务器进行唯一验证

用户名接口文件

地址	/server/checkUsername.php
作业描述	验证用户名是否可用
请求类型	get请求
参数	uname
返回数据的格式	普通字符串
返回数据说明	服务器返回ok代表用户名可用，返回error代表用户名不可用，此时需提示用户更换用户名

手机号接口文件

地址	/server/checkPhone.php
作业描述	验证手机号是否可用
请求类型	post请求
参数	e
返回数据的格式	JSON
返回数据说明	手机号可用返回{ “status”:0,“message”:{“tips”:“手机号可用”,“phonefrom”:“中国电信”}} 手机号不可用返回：{“status”:1,“message”:“手机号已被注册”}

代码

html代码

<form action="">
   用户名：<input type="text" id="username"><span id="username_result"></span><br>
    手机号码：<input type=