使用“互億無線”短信驗證碼接口來實現發送手機驗證碼功能


今天 突然發神經想到要做一個發送手機驗證碼的功能,因為看到很多用戶注冊這個模塊都有手機驗證這個功能,於是乎,俺就上網查了很多資料,整理了一下,做了一個簡單的手機驗證碼實現功能。不過我用的是試用賬號,只可以發送30個短信,如果要更多的話,需要充值,這是我感到很遺憾的事情。下面跟着我來實現這個功能吧,大神勿噴哈。

1、首先,上互億無線注冊一個賬號,http://www.ihuyi.com/,注冊后你可以看到你的賬號參數信息:

 

2、使用VS創建一個空的Web應用程序:

注冊靜態頁面:index.html

  1 <!doctype html>
  2 <html xmlns="http://www.w3.org/1999/xhtml">
  3 <head>
  4     <meta http-equiv="content-type" content="text/html; charset=gb2312" />
  5     <title>demo</title>
  6     <style>
  7         h3 {
  8             display:block;
  9             width:200px;
 10             margin:30px auto;
 11             text-align:center
 12         }
 13         table {
 14             width:400px;
 15             margin:10px auto;
 16 
 17         }
 18            
 19         #codeInput {
 20             width:90px;
 21         }
 22         .la {
 23             text-align:right
 24         }
 25         .control {
 26             line-height:50px;
 27         }
 28     </style>
 29     <script type="text/javascript" src="jquery.js"></script>
 30     <script language="javascript">
 31         function get_mobile_code() {
 32 
 33             var mobile = $("#mobile").val();
 34             if (!isMobile(mobile)) {
 35                 alert("手機號碼格式錯誤,請重新輸入");
 36             }
 37             else {
 38                 $.get("Post.aspx", { mobile: jQuery.trim($("#mobile").val()) }, function (msg) {
 39                     //alert(jQuery.trim(unescape(msg)));//unescape:對已經使用escape()函數編碼的字符串msg 進行解碼
 40                     if (msg == "提交成功") {
 41                         RemainTime();
 42                     }
 43                     else {
 44                         alert("手機驗證碼發送失敗");
 45                     }
 46                 });
 47             }
 48             
 49         };
 50 
 51 
 52         var iTime = 59;
 53         var Account;
 54         function RemainTime() {
 55             document.getElementById("zphone").disabled = true;
 56             var iSecond, sSecond = "", sTime = "";
 57             if (iTime >= 0) {
 58                 iSecond = parseInt(iTime % 60);
 59                 iMinute = parseInt(iTime / 60)
 60                 if (iSecond >= 0) {
 61                     if (iMinute > 0) {
 62                         sSecond = iMinute + "" + iSecond + "";
 63                     } else {
 64                         sSecond = iSecond + "";
 65                     }
 66                 }
 67                 sTime = sSecond;
 68                 if (iTime == 0) {
 69                     clearTimeout(Account);
 70                     sTime = "獲取手機驗證碼";
 71                     iTime = 59;
 72                     document.getElementById("zphone").disabled = false;
 73                 } else {
 74                     Account = setTimeout("RemainTime()", 1000);
 75                     iTime = iTime - 1;
 76                 }
 77             } else {
 78                 sTime = "沒有倒計時";
 79             }
 80             document.getElementById("zphone").value = sTime+"后重新獲取";
 81         }
 82 
 83         //手機號碼驗證
 84         function isMobile(s) {
 85             var reg=/^((13[0-9])|(15[^4,\D])|(18[0-9]))\d{8}$/; 
 86             if (!reg.exec(s)) {
 87                 return false;
 88             }
 89             return true;
 90             
 91         }
 92     </script>
 93 </head>
 94 
 95 <body>
 96     <form  method="post"action="judgeData.aspx">
 97         <h3>發送手機驗證碼</h3>
 98         <table>
 99             <tr>
100                 <td class="la"><label>手機:</label></td>
101                 <td>
102                     <input id="mobile" name="phone" type="text" required="required" /><span style="color:#FF0000"> *</span>
103                     <input id="zphone" type="button" value=" 發送手機驗證碼 " onclick="get_mobile_code();">
104                 </td>
105             </tr>
106             <tr class="control">
107                 <td class="la"><label>驗證碼:</label></td>
108                 <td><input type="text" name="captcha" id="codeInput" required="required" /></td>
109             </tr>
110             <tr>
111                 <td></td>
112                 <td><input type="reset" value="重置" />
113                 <input type="submit" value="提交"/></td>
114             </tr>
115         </table>
116     </form>
117 </body>
118 </html>

 

接收index.html Ajax過來的數據,並發送驗證碼到指定手機上:Post.aspx.cs

 1 using System;
 2 using System.Data;
 3 using System.Configuration;
 4 using System.Collections;
 5 using System.IO;
 6 using System.Net;
 7 using System.Text;
 8 using System.Web;
 9 using System.Web.Security;
10 using System.Web.UI;
11 using System.Web.UI.WebControls;
12 using System.Web.UI.WebControls.WebParts;
13 using System.Web.UI.HtmlControls;
14 
15 public partial class Post : System.Web.UI.Page
16 {
17     public static string PostUrl = ConfigurationManager.AppSettings["WebReference.Service.PostUrl"];
18     protected void Page_Load(object sender, EventArgs e)
19     {
20         //定義你的賬號密碼(你在互億無線注冊的賬號密碼)
21         string account = "互億無線注冊的賬號"; 22 string password = "互億無線注冊的密碼";//密碼可以使用明文密碼或使用32位MD5加密
23 
24         //獲取Ajax傳輸過來的手機號碼
25         string mobile = Request.QueryString["mobile"]; 26 
27         //在1000-10000之間隨機獲取一個數值 作為你的 手機驗證碼
28         Random rad = new Random();
29         int mobile_code = rad.Next(1000, 10000);
30 
31         //定義發送至手機中顯示的信息
32         string content = "您的驗證碼是:" + mobile_code + " 。請不要把驗證碼泄露給其他人。";
33 
34         //將你的手機號碼存入Session中
35         Session["mobile"] = mobile; 36 
37         //將你的手機驗證碼存入Session中
38         Session["mobile_code"] = mobile_code; 39 
40         string postStrTpl = "account={0}&password={1}&mobile={2}&content={3}";
41 
42         //將賬號,密碼,手機號碼,手機驗證碼等字符串進行編碼,並將它們存儲在字節數組postData中
43         UTF8Encoding encoding = new UTF8Encoding();
44         byte[] postData = encoding.GetBytes(string.Format(postStrTpl, account, password, mobile, content));
45 
46         //設置發送請求報文
47         HttpWebRequest myRequest = (HttpWebRequest)WebRequest.Create(PostUrl);//PostUrl在Web.config中定義
48         myRequest.Method = "POST";
49         myRequest.ContentType = "application/x-www-form-urlencoded";
50         myRequest.ContentLength = postData.Length;
51 
52         //創建流
53         Stream newStream = myRequest.GetRequestStream();
54 
55         //發送數據 56 newStream.Write(postData, 0, postData.Length); 57 newStream.Flush(); 58 newStream.Close(); 59 
60         //獲取返回信息(xml)
61         HttpWebResponse myResponse = (HttpWebResponse)myRequest.GetResponse();
62         if (myResponse.StatusCode == HttpStatusCode.OK)
63         {
64             StreamReader reader = new StreamReader(myResponse.GetResponseStream(), Encoding.UTF8);
65 
66             
67             string res = reader.ReadToEnd();
68 
69             //獲取返回枚舉值
70             int len1 = res.IndexOf("</code>");
71             int len2 = res.IndexOf("<code>");
72             string code = res.Substring((len2 + 6), (len1 - len2 - 6));
73 
74             //獲取返回信息
75             int len3 = res.IndexOf("</msg>"); 76 int len4 = res.IndexOf("<msg>"); 77 string msg = res.Substring((len4 + 5), (len3 - len4 - 5)); 78 Response.Write(msg); 79 
80             Response.End();
81 
82         }
83         else
84         {
85             //訪問失敗
86             Response.Write("err");
87         }
88     }
89 
90    
91 
92 
93 }


Post.aspx返回的是一個XML,我們需要返回給index.html的信息的是<msg>里面的內容。

1 <?xml version=\"1.0\" encoding=\"utf-8\"?>
2     <submitresult xmlns=\"http://106.ihuyi.cn/\">
3         <code>2</code>
4         <msg>提交成功</msg>
5         <smsid>401514767</smsid>
6     </submitresult>

 

發送驗證碼成功后,用戶輸入來自手機的驗證碼信息,並提交到judgeData.aspx:

 1 using System;
 2 using System.Collections.Generic;
 3 using System.Linq;
 4 using System.Web;
 5 using System.Web.UI;
 6 using System.Web.UI.WebControls;
 7 
 8 namespace phoneCheckCode
 9 {
10     public partial class judgeData : System.Web.UI.Page
11     {
12         protected void Page_Load(object sender, EventArgs e)
13         {
14             if (Session["mobile"] != null && Session["mobile_code"] != null)
15             {
16                 //獲取Session的數值
17                 string mobile = Session["mobile"].ToString();
18                 string mobile_code = Session["mobile_code"].ToString();
19 
20                 //獲取表單傳過來的值
21                 string f_mobile = Request.Form["phone"].ToString();
22                 string f_mobile_code = Request.Form["captcha"].ToString();
23                 if(f_mobile==""||f_mobile_code==""){
24                     Response.Write("<script>alert('驗證失敗');window.location = 'index.html';</script>");
25                 }
26                 else{
27                     if (mobile.Equals(f_mobile) && mobile_code.Equals(f_mobile_code))
28                     {
29                         Response.Write("<script>alert('驗證成功');window.location = 'main.html';</script>");
30                     }
31                     else {
32                         Response.Write("<script>alert('驗證失敗');window.location = 'index.html';</script>");
33                     }
34                 }
35 
36                 
37             }
38             else {
39                 Response.Write("<script>alert('驗證失敗');window.location = 'index.html';</script>");
40             }
41             
42         }
43     }
44 }

 

Web.config配置文件

 1 <?xml version="1.0" encoding="utf-8"?>
 2 
 3 <!--
 4   有關如何配置 ASP.NET 應用程序的詳細信息,請訪問
 5   http://go.microsoft.com/fwlink/?LinkId=169433
 6   -->
 7 
 8 <configuration>
 9   <appSettings>
10       <add key="WebReference.Service.PostUrl" value="http://106.ihuyi.cn/webservice/sms.php?method=Submit"/> 11       <add key="WebReference.sms" value="http://106.ihuyi.cn/webservice/sms.php?smsService"/>
12     </appSettings>
13   
14     <system.web>
15       <compilation debug="true" targetFramework="4.0" />
16       
17       
18       <!--設置Session失效時間為1分鍾--> 19 <sessionState mode="InProc" timeout="1"/>
20       
21     </system.web>
22 
23 </configuration>


3.最后進行測試實現:

 

 

 

好了,我只是一個小小的菜鳥,很多東西都不太懂,有什么錯誤或者不足請大家多多指教,謝謝啦。

2016-07-28

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM