如何在前端进行短信接口和语音验证接口的使用

今天我们来说一说如何在前端使用短信和语音验证码接口,为何要搞这个呢,因为我闲的,我膨胀了,我头铁

老规矩,先来说一下大体的思路,我使用的短信和语音验证接口是用的阿里云提供的,感觉还是比较好用的,我就拿语音验证码接口来做个示范,短信验证码接口和语音验证码接口使用起来是一样的,照着语音接口的示例改一下就完了。来,闲话不多说,我们直接开始好吧。

步骤:

《《《《《《《《《《《《《《《假设已经使用过阿里云请直接跳过这部分》》》》》》》》》》》》》》》》》》》》

1.我们需要去阿里云注册账户,并获取AppCode,步骤就不具体说了,没啥东西,就按照他的步骤注册就完了,你要是不会,联系我好吧,手把手教学

2.在顶端的搜索栏输入语音验证码

3.我是用的是图片上的这家的接口(注意我这不是打广告啊,他也没给我广告费啊,贼难受啊)

  

4.下面我们点进去,我们先选购买这个0元的来测试就可以

  

在购买下面有API的使用说明,你是不是觉得很舒服,都有使用说明啊,多爽,来那我们看看示例

给了好多请求示例,可惜没有前端用Ajax请求,有点惨是吧,但是不要慌,我们今天就是来搞这个的,所以不要慌,把头铁起来好吧,来我们继续向下看

5.现在我们用API的接口里提供调试工具选择去调试

    

6.进入调试页面,将你想测试的信息填入,AppCode填你自己的AppCode(AppCode在控制台>云市场(页面最左边选择云市场))

  

《《《《《《《《《《《《《《《跳过部分结束》》》》》》》》》》》》》》》》》》》》

7.发一个正常的请求,并分析请求

  

  可以看到调试信息里面给我们返回了一堆信息,我们主要来看看Request中的信息,既然有url和Header,那我们能不能根据信息从前端发fetch或Ajax请求调用呢

  当然是可以了啊,来进入整篇文章最关键的一步,最关键的啊,最关键的来了

8.通过fetch发送请求调用API

  注意:一定要有时间戳,因为不用动态时间戳,用固定的时间戳,API过一段时间调用不到了。

  

  当然,这是运行在服务器环境中的,啥环境都可以gulp,webpack你随意,不过一定能要配置反向代理(如何配置反向代理我在这就不说了,这不是今天要讨论的问题)

  

  

好了,今天就到这里吧,写的有点长,其实也不难,大家好好看看,有啥问题评论联系我就好,可能我这种方法不是最简便的,有更简便的可以交流交流

告辞,告辞!!!

  

原文地址:https://www.cnblogs.com/suihang/p/10032714.html

时间: 2024-11-09 00:45:51

如何在前端进行短信接口和语音验证接口的使用的相关文章

短信猫二次开发接口支持任何一种开发语言性能稳定

此款短信猫二次开发接口基于数据库开发方式支持任一种开发语言对短信猫开发,兼容性强.开发简单方便.灵活.稳定.可以快速地使您的应用系统实现短信功能,多种接口方式供二次开发时选择,系统具备良好的可扩展性.企事业单位通过此款短信猫二次开发接口方式实现短信功能,既实现了资源的共享和有效使用,便于企业对进出信息的管理.监控和统计,同时为以后短信功能的扩展提供了便利. 短信猫二次开发接口软件运行界面如图: 在该方案中,考虑到银行是对信息安全性要求很高的行业,采用短信猫作为短信收发设备,避免了常用的通过移动互

配送短信猫二次开发接口提供多种开发语言示例

免费配送的信猫二次开发接口提供有多种开发语言示例,如C#.C++.Delphi.PowerBuilder.VB.net.VC++.VisualBasic等多种开发示例方便程序开发人员开发调试.使用简单方便,将sms.dll文件拷贝到系统安装目录中的system32文件夹中,然后再根据以下接口函数说明和提供的例程源码开发,无需安装,免加密狗. 短信猫二次开发接口提供的开发语言示例有: 部分短信猫二次开发接口函数说明: 1.Sms_Connection(Com_Port As Integer,Com

Android短信收到,语音播报

发送短信功能界面 /** * 发送短信Demo * * @description: * @author ldm * @date 2016-4-22 上午9:07:53 */ public class SmsActivity extends Activity implements OnClickListener { public static final String SMS_RECIPIENT_EXTRA = "com.ldm.study.SMS_RECIPIENT"; public

iOS调用发邮件,打电话,发短信,自带浏览器接口的介绍

1.调用 自带mail [[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"mailto://[email protected]"]]; 2.调用 电话phone [[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"tel://8008808888"]]; 3.调用 SMS [[UIApplication s

短信接口源码,实现按钮变灰,倒计时的功能,非常不错

不多说费话了,直接上代码,有什么不懂的朋友可以给我留言,关于代码中返回值代表多少请参考官网,短信接口:http://www.56dxw.com  关于js的下载可以百度搜索一下,关于图片验证码可以从网上找一下,在这儿只记录一下如何调用短信接口实现短信的发送的 reg.aspx========================================================= <%@ Page Language="C#" AutoEventWireup="t

程序君带你畅聊发送短信验证码

现在不管是网站,还是app等互联网和移动互联网产品,绝大部分注册都是直接用手机号注册登录的,方式就是给手机发送短信验证码,然后把验证码填入,后台程序去匹配判断用户填入的验证码和发送的是否一致. 我最近做的好几个项目都用到了发送短信验证码的这个第三方接口,其实这个发送验证码的原理很简单,实现也很简单. 如下三个图,是我做的其中一个项目的相关效果截图: 我用的比较多的第三方短信接口是容联-云通讯的(http://www.yuntongxun.com/),它的API挺强大的,也挺稳定的,使用也不难,有

重构客户注册-基于ActiveMQ实现短信验证码生产者

重构目标:将bos_fore项目中的CustomerAction作为短信消息生产者,将消息发给ActiveMQ,创建一个单独的SMS项目,作为短信息的消费者,从ActiveMQ获取短信消息,调用第三方接口完成短信发送. CustomerAction完整代码: 1 @ParentPackage("json-default") 2 @Namespace("/") 3 @Controller 4 @Scope("prototype") 5 public

thinkphp5 阿里云短信 发送多参数的短信

有的朋友用阿里oss的时候可能会发送多参数的短信, 例如短信模版是  您好${code1},收到您的联系方式${code2},您的地址为${code3},我们会尽快派送. 类似于这样的多参数模版,首先第一关,可能是参数过长,怎么办,直接去阿里申请售后就可以了,和他们反馈一下,然后他们会给你把字数限制解除,然后你就可以传递超过20个字的内容了. 这一步完事,下一步就是接入阿里oss了,首先下载阿里oss的 类包了,去阿里官网下载就可以了,我这里整合的是thinkphp5.下载完成后具体步骤如下 1

Java通过SMS短信平台实现发短信功能

在项目中使用过发短信的功能,但那个由于公司内部的限制很麻烦,今天在网上找到一个简单的,闲来无事就把它记录如下: 本程序是通过使用中国网建提供的SMS短信平台实现的(该平台目前为注册用户提供5条免费短信,3条免费彩信,这足够用于我们测试用了.在使用前需要注册,注册地址为http://sms.webchinese.cn/reg.shtml),下面是程序源码: /** * @Author dengsilinming * @Date 2012-9-18 * */ package com.dengsili