接收短信消息接口API,使用ajax跨域无刷新实现根据手机号码发送6位短信验证码

应用场景:登录验证,注册账号,密码找回,绑定手机号等功能
接收短信消息接口API,使用ajax跨域无刷新实现根据手机号码发送6位短信验证码_第1张图片

1. 本接口采用的是聚合数据接口:https://www.juhe.cn/docs/api/id/54

2. 首先,注册账号申请快递单号接口:获取申请的key
在这里插入图片描述

3. 短信模板申请
3.1. 因为等会需要短信模板的ID,所以需要先申请短信模板:https://www.juhe.cn/sms(申请完后需要等大概5分钟,系统会审核你的模板)

接收短信消息接口API,使用ajax跨域无刷新实现根据手机号码发送6位短信验证码_第2张图片

3.2 审核通过后会产生一个短信模板ID,记住他,等会会用。(申请页面底部)
在这里插入图片描述

4. 接口参数查看(主要是这四个参数需要传到服务端)
接收短信消息接口API,使用ajax跨域无刷新实现根据手机号码发送6位短信验证码_第3张图片

参数简单说明:
mobile:接收的手机号
tpl_id:短信模板ID(第三步申请那个)
tpl_value:变量名和变量值(说人话就是手机号收到的数据,我们设置的是6位数验证码)
key:短信API申请的key(第二步申请的key)
dtype:根据自己需求设置,等会不会设置。

5. 代码实现

  1. 使用Jquery的ajax请求(因为服务端没有主动设置开放CROS资源共享)浏览器默认同源策略,需要跨域访问,此时用:dataType:“jsonp” 即可
  2. 复制我代码运行可能会失败,因为默认免费只有10条短信发送,用完需要买。需要你们自己去申请



    
    
    
    发送短信API
    
    







获取到的数据结果,此时就发送短信成功了,可以看到已经收到短信了。
接收短信消息接口API,使用ajax跨域无刷新实现根据手机号码发送6位短信验证码_第4张图片

注意保存返回的状态和sid:可以存储到数据库
还有生成的随机号码一起返回到数据库:方便验证用户输入的是否和收到的验证码是否匹配

你可能感兴趣的:(jquery,ajax)