转:http://blog.csdn.net/sxdtzhaoxinguo/article/details/34437591

近来由
于项目需要,需要用到手机短信验证码的功能,其中最主要的是用到了第三方提供的短信平台接口WebService客户端接口,下面我把我在项目中用到的记录一下,以便给大家提供个思路,由于本人的文采有限,还请大家见谅!

一:首先上几张案例截图,以便大家可以了解一下短信验证码的流程,这里我在做的过程中也参考了很多网站的短信验证码,比如:58同城,汽车之家等。

1.点击获取验证码之前的样式:

Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用插图

2.输入正确的手机号后点击获取验证码之后的样式:

Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用插图1

3.如果手机号已经被注册的样式:

Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用插图2

4.如果一个手机号一天发送超过3次就提示不能发送:

Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用插图3

二:前台的注册页面的代码:reg.jsp

[html] 
view plain  
copy  
Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用插图4
Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用插图5

  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%@taglib prefix="s" uri="/struts-tags"%>  
  3. <%@page import="cn.gov.csrc.base.action.FindAllData"%>  
  4. <%  
  5.     String path = request.getContextPath();  
  6.     String basePath = request.getScheme() + "://"  
  7.             + request.getServerName() + ":" + request.getServerPort()  
  8.             + path + "/";  
  9. %>  
  10. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  11. <html>  
  12. <head>  
  13. <base href="<%=basePath%>">  
  14. <title>中国证券会证券期货违法违规举报中心-注册</title>  
  15. <meta http-equiv="pragma" content="no-cache">  
  16. <meta http-equiv="cache-control" content="no-cache">  
  17. <meta http-equiv="expires" content="0">  
  18. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
  19. <meta http-equiv="description" content="This is my page">  
  20. <link rel="shortcut icon" type="image/x-icon" href="<%=request.getContextPath()%>/images/favicon.ico" />  
  21. <link rel="stylesheet" type="text/css"  
  22.     href="<%=request.getContextPath()%>/css/main.css">  
  23. <link  
  24.     href="<%=request.getContextPath()%>/formValidator1/style/validator.css"  
  25.     rel="stylesheet" type="text/css" />  
  26. <style type="text/css">  
  27. button {  
  28.     background: #F0F0F0 repeat-x;  
  29.     padding-top: 3px;   
  30.     border-top : 1px solid #708090;  
  31.     border-right: 1px solid #708090;  
  32.     border-bottom: 1px solid #708090;  
  33.     border-left: 1px solid #708090;  
  34.     width: auto;  
  35.     line-height: 12pt;   
  36.     font-size : 10pt;  
  37.     cursor: hand;  
  38.     font-size: 10pt;  
  39.     border-top: 1px solid #708090;  
  40. }  
  41. </style>  
  42. <script src="<%=request.getContextPath()%>/js/jquery-1.7.2.min.js"  
  43.     type="text/javascript"></script>  
  44. <script src="<%=request.getContextPath()%>/formValidator1/formValidator-4.0.1.js"  
  45.     type="text/javascript"></script>  
  46. <script src="<%=request.getContextPath()%>/formValidator1/formValidatorRegex.js"  
  47.     type="text/javascript"></script>  
  48. <script src="<%=request.getContextPath()%>/js/register.js"  
  49.     type="text/javascript"></script>  
  50. <script src="<%=request.getContextPath()%>/js/sms.js"  
  51.     type="text/javascript"></script>  
  52. <script type="text/javascript">  
  53.     function changeCheckNum() {  
  54.         var checkNumImage_ = document.getElementById("checkNumImage");  
  55.         checkNumImage_.src = "${pageContext.request.contextPath}/image.jsp?timeStamp="+ new Date().getTime();  
  56.     }  
  57. </script>  
  58. <script type="text/javascript">  
  59.     var msg = "${message}";  
  60.     if (msg != "") {  
  61.         alert(msg);  
  62.     }  
  63. </script>  
  64. </head>  
  65. <body>  
  66.     <%@include file="/statics/top.jspf"%>  
  67.     <div class="center_division">  
  68.         <div class="center_body">  
  69.             <div class="center_menu">  
  70.                 <font color="#000000">当前位置:</font>  
  71.                 <a href="<%=request.getContextPath()%>/statics/reg.jsp"><font color="#000000">用户注册</font></a>  
  72.             </div>  
  73.         </div>  
  74.         <div class="center_body_menu">  
  75.             <s:form action="RegisterAction_register" id="form1" name="form1" method="post" namespace="/">  
  76.                 <table id="tb">  
  77.                     <tr>  
  78.                         <td colspan="3" align="center" bgcolor="#DDDFE1">举报人基本信息</td>  
  79.                     </tr>  
  80.                     <tr>  
  81.                         <td align="center" width="30%">    <img src="images/new_reg_xing.gif"/>用户名:</td>  
  82.                         <td align="center" width="40%">  
  83.                             <s:textfield name="username" id="username" cssStyle="width:160px;height:24px;" onblur="checkusername()"/>  
  84.                         </td>  
  85.                         <td align="left" width="30%">  
  86.                             <span id="usernameTip">  
  87.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  88.                                     <s:param>username</s:param>  
  89.                                 </s:fielderror>  
  90.                             </span>  
  91.                         </td>  
  92.                     </tr>  
  93.                     <tr>  
  94.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>登录密码:</td>  
  95.                         <td align="center" width="40%">  
  96.                             <s:password name="password" id="password" cssStyle="width:160px;height:24px;" onblur="checkpassword()"/>  
  97.                         </td>  
  98.                         <td align="left" width="30%">  
  99.                             <span id="passwordTip">  
  100.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  101.                                     <s:param>password</s:param>  
  102.                                 </s:fielderror>  
  103.                             </span>  
  104.                         </td>  
  105.                     </tr>  
  106.                     <tr>  
  107.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>确认密码:</td>  
  108.                         <td align="center" width="40%">  
  109.                             <s:password name="passwordRepeat" id="passwordRepeat" cssStyle="width:160px;height:24px;" onblur="checkpasswrodb()"/>  
  110.                         </td>  
  111.                         <td align="left" width="30%">  
  112.                             <span id="passwordRepeatTip">  
  113.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  114.                                     <s:param>passwordRepeat</s:param>  
  115.                                 </s:fielderror>  
  116.                             </span>  
  117.                         </td>  
  118.                     </tr>  
  119.                     <tr>  
  120.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>姓        名:</td>  
  121.                         <td align="center" width="40%">  
  122.                             <s:textfield name="nickname" id="nickname" cssStyle="width:160px;height:24px;" onblur="checknickname()"/>  
  123.                         </td>  
  124.                         <td align="left" width="30%">  
  125.                             <span id="nicknameTip">  
  126.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  127.                                     <s:param>nickname</s:param>  
  128.                                 </s:fielderror>  
  129.                             </span>  
  130.                         </td>  
  131.                     </tr>  
  132.                     <tr>  
  133.                         <td align="center" width="30%">性        别:</td>  
  134.                         <td align="center" width="40%">  
  135.                             <s:radio list="#application.dataMap.get('10001')" name="jbSex" cssStyle="height:24px;"/>  
  136.                         </td>  
  137.                         <td align="left" width="30%"></td>  
  138.                     </tr>  
  139.                     <tr>  
  140.                         <td align="center" width="30%">联系地址:</td>  
  141.                         <td align="center" width="40%">  
  142.                             <s:textfield name="jbAddress" id="jbAddress" cssStyle="width:160px;height:24px;" />  
  143.                         </td>  
  144.                         <td align="left" width="30%">  
  145.                             <span id="jbAddressTip">  
  146.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  147.                                     <s:param>jbAddress</s:param>  
  148.                                 </s:fielderror>  
  149.                             </span>  
  150.                         </td>  
  151.                     </tr>  
  152.                     <tr>  
  153.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>联系手机:</td>  
  154.                         <td align="center" width="40%">  
  155.                             <s:textfield id="jbPhone" name="jbPhone" cssStyle="width:160px;height:24px;" onblur="checkjbPhone()"/>  
  156.                         </td>  
  157.                         <td align="left" width="30%">  
  158.                             <span id="jbPhoneTip">  
  159.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  160.                                     <s:param>jbPhone</s:param>  
  161.                                 </s:fielderror>  
  162.                             </span>  
  163.                         </td>  
  164.                     </tr>  
  165.                     <tr>  
  166.                         <td align="center"><img src="images/new_reg_xing.gif"/>短信验证码:</td>  
  167.                         <td align="left" colspan="2" style="padding-left: 112px;">  
  168.                             <s:textfield id="SmsCheckCode" name="SmsCheckCode" cssStyle="width:80px;height:24px;" maxLength="6" />  
  169.                             <span><input type="button" id="btnSendCode" name="btnSendCode" value="免费获取验证码" onclick="sendMessage()" /></span>  
  170.                             <span id="SmsCheckCodeTip">  
  171.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  172.                                     <s:param>SmsCheckCodeTip</s:param>  
  173.                                 </s:fielderror>  
  174.                             </span>  
  175.                         </td>  
  176.                     </tr>  
  177.                     <tr>  
  178.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>证件类型:</td>  
  179.                         <td align="center" width="40%">  
  180.                         <s:select list="#application.dataMap.get('10002')" label=""  
  181.                                 headerKey="" headerValue="--请选择--" value="1" listValue="value" onchange="enableCredentialsCode(this)"  
  182.                                 name="jbCredentialsName" id="jbCredentialsName" cssStyle="width:160px;height:24px;"/>  
  183.                         </td>  
  184.                         <td align="left" width="30%">  
  185.                             <s:fielderror cssStyle="color:red;padding-left:10px;">  
  186.                                 <s:param>jbCredentialsName</s:param>  
  187.                             </s:fielderror>  
  188.                         </td>  
  189.                     </tr>  
  190.                     <tr>  
  191.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>证件号码:</td>  
  192.                         <td align="center" width="40%">  
  193.                             <s:textfield name="jbCredentialsCode" id="jbCredentialsCode" cssStyle="width:160px;height:24px;" onblur="checkjbCredentialsCode()"/>  
  194.                         </td>  
  195.                         <td align="left" width="30%">  
  196.                             <span id="jbCredentialsCodeTip">  
  197.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  198.                                     <s:param>jbCredentialsCode</s:param>  
  199.                                 </s:fielderror>  
  200.                             </span>  
  201.                         </td>  
  202.                     </tr>  
  203.                     <tr>  
  204.                         <td align="center" width="30%">单位名称:</td>  
  205.                         <td align="center" width="40%">  
  206.                             <s:textfield name="jbCompanyName" id="jbCompanyName" cssStyle="width:160px;height:24px;" />  
  207.                         </td>  
  208.                         <td align="left" width="30%">  
  209.                             <span id="jbCompanyNameTip">  
  210.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  211.                                     <s:param>jbCompanyName</s:param>  
  212.                                 </s:fielderror>  
  213.                             </span>  
  214.                         </td>  
  215.                     </tr>  
  216.                     <tr>  
  217.                         <td align="center" width="30%"><img src="images/new_reg_xing.gif"/>所在地区:</td>  
  218.                         <td align="center" width="40%">  
  219.                         <s:select list="#application.dataMap.get('10003')" label=""  
  220.                                 headerKey="" headerValue="--请选择--" listKey="key"  
  221.                                 cssStyle="width:160px;height:24px;" listValue="value" id="jbSourceArea"  
  222.                                 name="jbSourceArea" onblur="checkjbSourceArea()"/>  
  223.                         </td>  
  224.                         <td align="left" width="30%">  
  225.                             <span id="jbSourceAreaTip">  
  226.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  227.                                     <s:param>jbSourceArea</s:param>  
  228.                                 </s:fielderror>  
  229.                             </span>  
  230.                         </td>  
  231.                     </tr>  
  232.                     <tr>  
  233.                         <td align="center" width="30%">    <img src="images/new_reg_xing.gif"/>验证码:</td>  
  234.                         <td align="center" width="40%">  
  235.                             <s:textfield id="checkNum" name="checkNum" cssStyle="width:60px;height:24px;" onblur="checkNumber()" maxLength="4"/>  
  236.                             <img id="checkNumImage" src="${pageContext.request.contextPath}/image.jsp">  
  237.                             <a onClick="changeCheckNum()" title="点击换一张" style="cursor:hand;"> 换一张</a>  
  238.                         </td>  
  239.                         <td align="left" width="30%">  
  240.                             <span id="checkNumTip">  
  241.                                 <s:fielderror cssStyle="color:red;padding-left:10px;">  
  242.                                     <s:param>checkNumTip</s:param>  
  243.                                 </s:fielderror>  
  244.                             </span>  
  245.                         </td>  
  246.                     </
    本博客所有文章如无特别注明均为原创。
    复制或转载请以超链接形式注明转自起风了,原文地址《Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用
   

还没有人抢沙发呢~