项目前端页面实例

第1步:登录阿里大于控制台

https://www.alidayu.com/center/user/account?spm=0.0.0.0.P1K1jG

第2步:创建应用

第3步:配置短信签名

第4步:配置短信模板

第5步:前端

<tr class="margin-top">

<td class="padding-top text-center">手机号</td>

<td><input type="text" class="inputs" id="Phone" name="Phone"> </td>

<td><input type="button" value="获取验证码" id="sms" onclick="sendemail()"></td>

</tr>

<tr>

<td class="padding-top text-center">验证码</td>

<td><input type="text" class="inputs" id="Code" name="Code"></td>

</tr>

第6步:js处理

$(function () {

$("#sms").click(function () {

sendCode($("#sms"));

});

v = getCookieValue("secondsremained");//获取cookie值

if (v > 0) {

settime($("#sms"));//开始倒计时

}

})

//发送验证码

function sendCode(obj) {

var phoneNumber = $("#Phone").val();

var result = isPhoneNum(phoneNumber);

if (result) {

//将手机利用ajax提交到后台的发短信接口

$.post("/College/Code", { Phone: phoneNumber }, function (data) {

if (data == "ok") {

alert("验证码发送成功!");

} else {

alert("验证码发送失败,请重新发送!");

}

});

addCookie("secondsremained", 60, 60);//添加cookie记录,有效时间60s

settime(obj);   //开始倒计时

}

}

//开始倒计时

var countdown;

function settime(obj) {

countdown = getCookieValue("secondsremained");

if (countdown == 0) {

obj.removeAttr("disabled");

obj.val("获取验证码");

return;

} else {

obj.attr("disabled", true);

obj.val("重新发送(" + countdown + ")");

countdown--;

editCookie("secondsremained", countdown, countdown + 1);

}

setTimeout(function () { settime(obj) }, 1000) //每1000毫秒执行一次

}

//校验手机号是否合法

function isPhoneNum(phoneNumber) {

var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;

if (!myreg.test(phoneNumber)) {

alert('请输入有效的手机号码!');

return false;

} else {

return true;

}

}

//发送验证码时添加cookie

function addCookie(name, value, expiresHours) {

var cookieString = name + "=" + escape(value);

//判断是否设置过期时间,0代表关闭浏览器时失效

if (expiresHours > 0) {

var date = new Date();

date.setTime(date.getTime() + expiresHours * 1000);

cookieString = cookieString + ";expires=" + date.toUTCString();

}

document.cookie = cookieString;

}

//修改cookie的值

function editCookie(name, value, expiresHours) {

var cookieString = name + "=" + escape(value);

if (expiresHours > 0) {

var date = new Date();

date.setTime(date.getTime() + expiresHours * 1000); //单位是毫秒

cookieString = cookieString + ";expires=" + date.toGMTString();

}

document.cookie = cookieString;

}

//根据名字获取cookie的值

function getCookieValue(name) {

var strCookie = document.cookie;

var arrCookie = strCookie.split("; ");

for (var i = 0; i < arrCookie.length; i++) {

var arr = arrCookie[i].split("=");

if (arr[0] == name) {

return unescape(arr[1]);

break;

} else {

return "";

break;

}

}

}

第7步:后台控制器处理

#region 商学院报名发送验证码

public ActionResult ValidateCode()

{

string Code = GetRandomString(6);

string url = "https://eco.taobao.com/router/rest";

string appkey = "****";  //此处填写你自己的

string secret = "****";   //此处填写你自己的

ITopClient client = new DefaultTopClient(url, appkey, secret);

AlibabaAliqinFcSmsNumSendRequest req = new AlibabaAliqinFcSmsNumSendRequest();

req.Extend = "";              //可空,返回状态

req.SmsType = "normal";             //不可更改

req.SmsFreeSignName = "个人小站";       //申请的短信签名,不可填写与申请的不一

req.SmsParam = "{VCode:'" + Code + "'}";  //模板内参数必填

req.RecNum = Request["Phone"];         //接收者手机号码

req.SmsTemplateCode = "SMS_74235011";    //短信模板的编号,不可出错

AlibabaAliqinFcSmsNumSendResponse rsp = client.Execute(req);

if (rsp.IsError == false)

{

Console.WriteLine(rsp.Body);

//return Content(rsp.Body);

}

//将验证码设置缓存

var CodeInfo = (Object)Code;

CacheOpt.SetCache("Code", CodeInfo, Convert.ToInt32(60));

return Content("ok");

}

#region 生成6位验证码

public string GetRandomString(int iLength)

{

string buffer = "0123456789";    // 随机字符中也可以为汉字(任何)

StringBuilder sb = new StringBuilder();

Random r = new Random();

int range = buffer.Length;

for (int i = 0; i < iLength; i++)

{

sb.Append(buffer.Substring(r.Next(range), 1));

}

return sb.ToString();

}

#endregion

第8步:缓存处理

public class CacheOpt

{

/// <summary>

/// 设置缓存

/// </summary>

/// <param name="CacheKey"></param>

/// <param name="objObject"></param>

/// <param name="Seconds">超过多少秒后过期</param>

public static void SetCache(string CacheKey, object objObject, long Seconds)

{

System.Web.Caching.Cache objCache = HttpRuntime.Cache;

objCache.Insert(CacheKey, objObject, null, System.DateTime.Now.AddSeconds(Seconds), TimeSpan.Zero);

}

/// <summary>

/// 获取数据缓存

/// </summary>

/// <param name="CacheKey">键</param>

public static object GetCache(string CacheKey)

{

System.Web.Caching.Cache objCache = HttpRuntime.Cache;

return objCache[CacheKey];

}

}

public class CacheOpt

{

/// <summary>

/// 设置缓存

/// </summary>

/// <param name="CacheKey"></param>

/// <param name="objObject"></param>

/// <param name="Seconds">超过多少秒后过期</param>

public static void SetCache(string CacheKey, object objObject, long Seconds)

{

System.Web.Caching.Cache objCache = HttpRuntime.Cache;

objCache.Insert(CacheKey, objObject, null, System.DateTime.Now.AddSeconds(Seconds), TimeSpan.Zero);

}

/// <summary>

/// 获取数据缓存

/// </summary>

/// <param name="CacheKey">键</param>

public static object GetCache(string CacheKey)

{

System.Web.Caching.Cache objCache = HttpRuntime.Cache;

return objCache[CacheKey];

}

}

注:完整版项目地址:http://www.gmkcn.com/

asp.net mvc 接入阿里大于 短信验证码发送的更多相关文章

  1. asp.net mvc 接入美圣短信 验证码发送

    第1步:登录美圣短信控制台 http://www.rcscloud.cn/hy/HY_ZH/login 账号:******* 密码:******* http://www.rcscloud.cn/com ...

  2. ASP版_阿里大于短信API Demo

    阿里大于申请地址:http://www.alidayu.com 阿里大于短信发送Demo: ******index.asp************* <%@LANGUAGE="VBSC ...

  3. Aps.Net Core3.1 WebApi发送阿里云短信验证码

    1.前言 转眼又要过了一年了 好久没写博客了,人不学就要落后,今天有时间把以前弄的发送阿里云短信验证码登录记录一下. 2.准备条件 1)去阿里云官网注册一个账号.有账号直接登录就行,以前新人好像有免费 ...

  4. php实现的IMEI限制的短信验证码发送类

    php实现的IMEI限制的短信验证码发送类 <?php class Api_Sms{ const EXPIRE_SEC = 1800; // 过期时间间隔 const RESEND_SEC = ...

  5. PHP实现对短信验证码发送次数的限制(防机刷验证码)

    PHP实现对短信验证码发送限制(防止机刷验证码) 对用户获取短信验证码的手机号.ip.和浏览器(使用唯一标识)进行限制.本文介绍的方法是对用户每天只能通过同一浏览器或同一ip地址获取验证码10次或者同 ...

  6. Thinkphp5使用阿里大于短信验证

    现在各种平台登录验证很多时候会使用短信验证,快捷安全,有很多平台提供短信验证服务,相比较而言阿里大于价格比较便宜,快捷,所以在在千锋日常的php教学中多以此为例来说明短信验证的使用.下面我们在tp5中 ...

  7. thinkphp5阿里大于短信接口

    function autumn_sendsms($tel,$stype){ $pd_go=true; if($tel==''){ $msg='手机号不能为空'; $pd_go=false; } if( ...

  8. ThinkPHP3.2.3框架下接入阿里云短信服务接口实现:注册登录

    首先介绍下短信注册登录流程: 注册页面点击获取手机号验证码按钮,用jquery的click事件POST或GET方法把手机号发送到后台控制器: 后台控制器创建函数,收到手机号后生成随机码,例如:6位的随 ...

  9. TP3.2.3 接入阿里sms 短信接口

    阿里云短信接口 配置文件 config.php //阿里大鱼 'Ali_SMS' =>array( 'sms_temp' =>'短信模板', 'sms_sign' =>'签名', ' ...

随机推荐

  1. Html table 合并单元格

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. CentOS7.2设置静态IP

    首先将源文件进行备份: [zgw@localhost 桌面]$ sudo cp /etc/sysconfig/network-scripts/ifcfg-eno16777736 /etc/syscon ...

  3. Hadoop-2.7.2集群的搭建——集群学习日记

    前言 因为比赛的限制是使用Hadoop2.7.2,估在此文章下面的也是使用Hadoop2.7.2,具体下载地址为Hadoop2.7.2 开始的准备 目前在我的实验室上有三台Linux主机,因为需要参加 ...

  4. 设计模式的征途—14.职责链(Chain of Responsibility)模式

    相信大家都玩过类似于“斗地主”的纸牌游戏,某人出牌给他的下家,下家看看手中的牌,如果要不起,则将出牌请求转发给他的下家,其下家再进行判断.一个循环下来,如果其他人都要不起该牌,则最初的出牌者可以打出新 ...

  5. Work 3(工作类) (2017.07.01)

  6. Java 多态的实现原理

    一个对象变量可以指示多种实际类型的现象称为多态 允许不同类的对象对同一消息做出响应.方法的重载.类的覆盖正体现了多态. 1.多态的机制 1.1 本质上多态分两种 .编译时多态(又称静态多态) .运行时 ...

  7. 聊天类APP功能测试总结

    做聊天类的APP 测试已经有一段时间了,也许哪天就不做了,趁今天轻松点,记录下来. 聊天类的APP都差不多,不管是微信,还是米聊,还是QQ,如果抓住了共性,测试的点都差不太多. 我用编程的术语来比方功 ...

  8. 【RequireJS】requireJS的基础知识

    1. requirejs的优点 1)异步加载依赖的文件 2)管理文件加载顺序 3)管理文件加载的包路径 2. requirejs下载地点 https://github.com/jrburke/requ ...

  9. 基于.NET CORE微服务框架 -谈谈Cache中间件和缓存降级

    1.前言 surging受到不少.net同学的青睐,也提了不少问题,提的最多的是什么时候集成API 网关,在这里回答大家最近已经开始着手研发,应该在1,2个月内会有个初版API网关,其它像Token身 ...

  10. css3关键帧动画实现轮播效果

    实现效果:打开手机京东,可以看到首页的头部,以这个头部为基础,仿写一个类似的样式. 思路:仔细观察可以发现,手机京东的头部是以一个搜索栏和轮播特效组成的,而这个搜索栏是以轮播特效做为背景的,现在运用c ...