短信验证码登录

1、新建一个ems.ejs文件

<div>
    <label for="phone">手机号:</label>
    <input name="phone" id="phone" type="text">
    <button onclick="sendCode()">发送验证码</button>
    <span id="sendMsg"></span>
</div>
<div>
    <label for="code">输入验证码</label>
    <input name="code" id="code" type="text">
    <button onclick="verifyCode()">验证</button>
    <span id="verifyMsg"></span>
</div>

<script src="../JavaScript/jquery-1.11.3.js"></script>
<script>
	//发送验证码
    function sendCode() {
        let phone=$("#phone").val();
        $.ajax({
            type:"post",
            url:"/sms.do",
            data:{phone},
            success(data){
                $("#sendMsg").text(data)
            }
        })
    }
    //验证验证码
    function verifyCode() {
        let code=$("#code").val();
        let phone=$("#phone").val();
        $.ajax({
            type:"post",
            url:"/verifyCode.do",
            data:{code,phone},
            success(data){
                $("#verifyMsg").text(data)
            }
        })
    }

}

2、路由拦截

const smsCtrl=require("../controller/smsCtrl")
//短信验证
router.get("/sms",pageCtrl.sms)
router.post("/sms.do",smsCtrl.smsPhone)
router.post("/verifyCode.do",smsCtrl.verifyCode)

3.进入leancloud官网https://leancloud.cn/
a.点击右上角控制台
b.注册登录在这里插入图片描述

c.创建应用
在这里插入图片描述

d.进入右上角设置界面
在这里插入图片描述

e.基本信息这里选择开发版
在这里插入图片描述

f.复制APP ID和APP Key在这里插入图片描述

g.安全中心,打开所有开关在这里插入图片描述

h.点击消息-设置在这里插入图片描述

i.创意一个新的短信签名
在这里插入图片描述

j.等待审核通过
在这里插入图片描述

4.下载:npm install leancloud-storage -s
5.在controller配置

const sms=require("leancloud-storage")
//输入上面复制的id和**
const app_id="HLMe7naREa25HS3AIhdIAuS5-gzGzoHsz"
const app_key="lk3uLAlkjTRv2cFPGJJm8SjJ"
sms.init({
    appId:app_id,
    appKey:app_key
})

6.公开对象

module.exports={
    smsPhone(req,resp){
        let phone=req.body.phone;
        //给第三方发送
         sms.Cloud.requestSmsCode({
             mobilePhoneNumber: phone,  // 目标手机号
             name: '短信验证',//应用名称
             code: '验证码',
             ttl: 1,//时效
             sign:"欢迎使用"
             // 短信格式
             // 【花加家公司】您正在使用 毕业设计 服务进行短信认证,您的 验证码 是: 874853,请在 1 分钟内完成验证。
    }).then(function(){
             //短信发送成功
             resp.send("短信发送成功")
         }).catch(function () {
             //短信发送失败
             resp.send("短信发送失败")
         })
    },
    verifyCode(req,resp){
        let {code,phone}=req.body.code
        sms.Cloud.verifySmsCode(code,phone).then(function () {
            //验证成功
            resp.send("短信验证成功")
        }).catch(function () {
            //验证失败
            resp.send("验证码输入错误")
        })
    }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

CRMEB定制开发

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值