jsp+servlet 实现发送短信验证码,并开始倒计时

大致流程如下:
1、客户端js通过发送http请求(发短信接口)到服务器,将手机号等信息传递给服务器
2、服务器收到请求后校验参数,参数正确调用第三方短信接口,并将随机产生的验证码保存在服务器(session缓存)。
3、客户端收到服务器的返回,如果调用成功,开始倒计时同时等待用户输入收到的验证码,如果调用失败,将失败信息提示给用户。

本示例采用jsp+servlet,注意要在web.xml中配置
短信接口采用互亿在线 网址就自行百度

Alt
手机验证码其实各个短信验证平台都给出了端口代码,所以在项目中使用的时候并没有出什么BUG。

JSP页面代码

<script type="text/javascript">
	
	function get_mobile_code() {
		$.post('phonecode', {
			mobile : jQuery.trim($('#mobile').val())
		}, function(msg) {

			RemainTime();

		});
	};
	var iTime = 59;
	var Account;
	function RemainTime() {
		document.getElementById('zphone').disabled = true;
		var iSecond, sSecond = "", sTime = "";
		if (iTime >= 0) {
			iSecond = parseInt(iTime % 60);
			iMinute = parseInt(iTime / 60)
			if (iSecond >= 0) {
				if (iMinute > 0) {
					sSecond = iMinute + "分" + iSecond + "秒";
				} else {
					sSecond = iSecond + "秒";
				}
			}
			sTime = sSecond;
			if (iTime == 0) {
				clearTimeout(Account);
				sTime = '获取手机验证码';
				iTime = 59;
				document.getElementById('zphone').disabled = false;
			} else {
				Account = setTimeout("RemainTime()", 1000);
				iTime = iTime - 1;
			}
		} else {
			sTime = '没有倒计时';
		}
		document.getElementById('zphone').value = sTime;
	}
script>


<body>
	<div id="reg">
		<form action="customer" method="post">
			<ul>
				<li class="m">用户帐号li>
				<li class="r"><input name="account" type="text" />li>

				<li class="m">手机号码li>
				<li class="r"><input id="mobile" name="mobile" type="text" />li>

				<li class="m">验证码li>
				<li class="r"><input type="text" name="mobile_code" /> <input
					id="zphone" type="button" value=" 获取手机验证码 "
					onClick="get_mobile_code()">
				<li class="r"><input name="button" type="image" id="button"
					value="提交" />li>

			ul>
		form>
	div>
body>

Servlet代码
可以自行百度注册后取得密钥即可使用

public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		HttpSession session =request.getSession();
		String postUrl = "http://106.ihuyi.cn/webservice/sms.php?method=Submit";
		int mobile_code = (int)((Math.random()*9+1)*100000); //获取随机数
		String account = "*****"; //查看用户名是登录用户中心->验证码短信->产品总览->APIID
		String password = "*****";  //查看密码请登录用户中心->验证码短信->产品总览->APIKEY
		String mobile = request.getParameter("mobile");
		String content = new String("您的验证码是:" + mobile_code + "。请不要把验证码泄露给其他人。");
		session.setAttribute("mobile_code", mobile_code);
		try {

			URL url = new URL(postUrl);
			HttpURLConnection connection = (HttpURLConnection) url.openConnection();
			connection.setDoOutput(true);//允许连接提交信息
			connection.setRequestMethod("POST");//网页提交方式“GET”、“POST”
			connection.setRequestProperty("Content-Type", "application/x-www-form-urlencoded");
			connection.setRequestProperty("Connection", "Keep-Alive");
			StringBuffer sb = new StringBuffer();
			sb.append("account="+account);
			sb.append("&password="+password);
			sb.append("&mobile="+mobile);
			sb.append("&content="+content);
			java.io.OutputStream os =  connection.getOutputStream();
			os.write(sb.toString().getBytes());
			os.close();

			String line, result = "";
			BufferedReader in = new BufferedReader(new InputStreamReader(connection.getInputStream(), "utf-8"));
			while ((line = in.readLine()) != null) {
				result += line + "\n";
			}
			in.close();
			System.out.println(result);

		} catch (IOException e) {
			e.printStackTrace(System.out);
		}
	}

你可能感兴趣的:(jsp,java,手机验证码)