开发中使用 【容联 云通信】获取短信验证码的 Javascript 接口

2019-06-18 admin
  1. 注册账号:https://www.yuntongxun.com/,注册后送8元,开发试用可以用很久了。
  2. 在平台应用列表添加应用。
  3. 在测试号码中绑定测试手机号码,只有这个号码能接收验证短信。
  4. 在项目中绑定配置:将控制台首页的开发者主账号信息粘贴复制进下列接口代码的相应位置。

一个前后台分离的应用,在后台项目目录下建立 util文件夹,建立util/sms_util.js文件,文件内写使用 【容联 云通信】平台获取短信验证码的 Javascript 接口代码:

// 容联云通信 短信验证码接口

var md5 = require('blueimp-md5')
var moment = require('moment')
var Base64 = require('js-base64').Base64;
var request = require('request');

/*
生成指定长度的随机数
 */
function randomCode(length) {
    var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
    var result = ""; //统一改名: alt + shift + R
    for (var i = 0; i < length; i++) {
        var index = Math.ceil(Math.random() * 9);
        result += chars[index];
    }
    return result;
}
// console.log(randomCode(6));
exports.randomCode = randomCode;

/*
向指定号码发送指定验证码
 */
// 将控制台首页的开发者主账号信息粘贴复制进下列接口代码的相应位置
function sendCode(phone, code, callback) {
    var ACCOUNT_SID = '';
    var AUTH_TOKEN = '';
    var Rest_URL = '';
    var AppID = '';
    //1\. 准备请求url
    /*
    1.使用MD5加密(账户Id + 账户授权令牌 + 时间戳)。其中账户Id和账户授权令牌根据url的验证级别对应主账户。
    时间戳是当前系统时间,格式"yyyyMMddHHmmss"。时间戳有效时间为24小时,如:20140416142030
    2.SigParameter参数需要大写,如不能写成sig=abcdefg而应该写成sig=ABCDEFG
     */
    var sigParameter = '';
    var time = moment().format('YYYYMMDDHHmmss');
    sigParameter = md5(ACCOUNT_SID + AUTH_TOKEN + time);
    var url = Rest_URL + '/2019-6-16/Accounts/' + ACCOUNT_SID + '/SMS/TemplateSMS?sig=' + sigParameter;

    //2\. 准备请求体
    var body = {
        to: phone,
        appId: AppID,
        templateId: '1',
        "datas": [code, "1"]
    }
    //body = JSON.stringify(body);

    //3\. 准备请求头
    /*
    1.使用Base64编码(账户Id + 冒号 + 时间戳)其中账户Id根据url的验证级别对应主账户
    2.冒号为英文冒号
    3.时间戳是当前系统时间,格式"yyyyMMddHHmmss",需与SigParameter中时间戳相同。
     */
    var authorization = ACCOUNT_SID + ':' + time;
    authorization = Base64.encode(authorization);
    var headers = {
        'Accept': 'application/json',
        'Content-Type': 'application/json;charset=utf-8',
        'Content-Length': JSON.stringify(body).length + '',
        'Authorization': authorization
    }

    //4\. 发送请求, 并得到返回的结果, 调用callback
    // callback(true);
    request({
        method: 'POST',
        url: url,
        headers: headers,
        body: body,
        json: true
    }, function (error, response, body) {
        console.log(error, response, body);
        callback(body.statusCode === '000000');
        // callback(true);
    });
}
exports.sendCode = sendCode;

/*
sendCode('13716962779', randomCode(6), function (success) {
    console.log(success);
})*/

5.在后台路由文件/routes/index.js中引入,使用:

const sms_util = require('../util/sms_util')

/*
发送验证码短信
*/
router.get('/sendcode', function (req, res, next) {
  //1\. 获取请求参数数据
  var phone = req.query.phone;
  //2\. 处理数据
  //生成验证码(6位随机数)
  var code = sms_util.randomCode(6);
  //发送给指定的手机号
  console.log(`向${phone}发送验证码短信: ${code}`);
  sms_util.sendCode(phone, code, function (success) {//success表示是否成功
    if (success) {
      users[phone] = code
      console.log('保存验证码: ', phone, code)
      res.send({"code": 0})
    } else {
      //3\. 返回响应数据
      res.send({"code": 1, msg: '短信验证码发送失败'})
    }
  })
})

6.在前台应用中输入绑定的测试手机号,发送验证码。

[转载]原文链接:https://segmentfault.com/a/1190000019506488

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处。

转载请注明:文章转载自 JavaScript中文网 [https://www.javascriptcn.com]

本文地址:https://www.javascriptcn.com/read-67556.html

文章标题:开发中使用 【容联 云通信】获取短信验证码的 Javascript 接口

相关文章
bootstrap PrintThis打印插件使用详解
bootstrap PrintThis打印效果图: 如图,这个是调用了谷歌的打印,使用很方便,可以自己調样式,需要的可以研究一下,这边贴出使用方法。 附上GitHub:https://github.com/jasonday/printTh...
2017-03-16
vue 数组遍历方法forEach和map的原理解析和实际应用
一、前言 forEach和map是数组的两个方法,作用都是遍历数组。在vue项目的处理数据中经常会用到,这里介绍一下两者的区别和具体用法示例。 二、代码 1. 相同点 都是数组的方法 都用来遍历数组 两个函数都有4个参数:匿名函数中可传3...
2018-11-15
一些前端学习中好的书籍,整理
一、Javascript方面的书籍: 1 JavaScript权威指南(第6版):号称javascript圣经,前端必备;前端程序员学习核心JavaScript语言和由Web浏览器定义的JavaScript API的指南和综合参考手册; 2...
2015-11-12
html5+JavaScript教程-微信打飞机小游戏源码
js &#x2F;&#x2F; JavaScript Document var c = document.getElementById(&quot;dotu&quot;); var cxt = c.getContext(&quot;2d&q...
2015-11-12
JavaScript编辑器推荐
主流编辑器有SublimeText,Notepad++,webstorm等,是使用最广泛的编辑器,但也有一些JavaScript编辑器提供有着各自的特性和功能,适应不同人的需求,以下是几款优秀的编辑器,相信你一定能找到自己喜欢的。 1. W...
2015-11-12
js性能优化 如何更快速加载你的JavaScript页面
确保代码尽量简洁 不要什么都依赖JavaScript。不要编写重复性的脚本。要把JavaScript当作糖果工具,只是起到美化作用。别给你的网站添加大量的JavaScript代码。只有必要的时候用一下。只有确实能改善用户体验的时候用一下。 ...
2015-11-12
10个强大的纯CSS3动画案例分享
我们的网页外观主要由CSS控制,编写CSS代码可以任意改变我们的网页布局以及网页内容的样式。CSS3的出现,更是可以让网页增添了不少动画元素,让我们的网页变得更加生动有趣,并且更易于交互。本文分享了10个非常炫酷的CSS3动画案例,希望大家...
2015-11-16
请前往任务中心完善资料即可激活会员
登录后,点击右上角的用户名,在下拉菜单中可以进去“我的任务” 注册自动激活,本站没有VIP!没有充值!没有推广任务等等 回复即可下载 ...
2015-11-18
2015年JavaScript或“亲库而远框架”
2014年过去了,作为一个JavaScript开发者很难满怀信心的去“挽回”一个特定的库或技术,即便是强大的Angular,似乎也因为最近的一些事情而动摇。 2014年10月的ng-europe会议上,Angular开发者团队透露了一个关于...
2015-11-12
Android中Okhttp3实现上传多张图片同时传递参数
之前上传图片都是直接将图片转化为io流传给服务器,没有用框架传图片。 最近做项目,打算换个方法上传图片。 Android发展到现在,Okhttp显得越来越重要,所以,这次我选择用Okhttp上传图片。 Okhttp目前已经更新到Okhttp...
2017-03-17
回到顶部