手机号验真

1. 简介

1.1 场景简介

很多情况下需要对手机号的真实性进行校验,以确保收集的手机号真实有效。

本文将通过短信验证的接口及简道云 前端事件 ,为您详细讲解手机号验真案例的设置方法。

1.2 预期效果

以活动报名的场景为例,在表单中输入手机号码后,点击「获取验证码」,对应手机号即可收到包含验证码的短信,只有在「请输入验证码」字段中输入正确的验证码,才能成功提交表单,效果如下:

2. 接口准备

2.1 购买接口

首先我们需要找到一个支持手机短信验证的接口,我们以阿里云官方提供的接口为例,讲解如何在简道云的前端事件中配置:点击进入阿里云市场购买接口

我们先购买一个 0 元/15 次的体验版本,可以在 云市场 已购买的服务中看到我们刚刚购买的接口。

2.2 接口分析

接下来,点击接口,往下翻到 API 接口的详情介绍,对「短信接口」进行分析。

【调用地址】:http://dfsns.market.alicloudapi.com/data/send_sms 或 https://dfsns.market.alicloudapi.com/data/send_sms

【请求方式】:POST

【返回类型】:JSON

【请求的Headers】:Authorization: APPCODE +英文空格+ 你自己的 APPCODE(服从阿里云云市场的标准鉴权方式)

Authorization:APPCODE AppCode值

【请求body】

名称

类型

是否必须

描述

content

STRING

必选

code 为短信模板上的参数;1234 为参数值,可自定义传参。当有多个参数(如 TPL_0001 模板),以半角逗号“,”分隔。

phone_number

STRING

必选

接受短信的手机号码

template_id

STRING

必选

模板 ID:代表整体短信文案模板

正常返回示例:

{ 
  "request_id": "TID8bf47ab6eda64476973cc5f5b6ebf57e",
    "status": "OK" 
}

3. 表单设计

以活动报名的场景为例:

3.1 表单搭建

新建「活动报名表」表单,字段设置如下:

字段名称

字段类型

字段设置

选择报名活动

下拉框

自定义设置活动名称

姓名

单行文本

手机号码

单行文本

生成默认 CODE

数字

获取验证码

单选按钮组

不显示标题,设置选项为:获取验证码

请输入验证码

单行文本

3.2 设置公式

1)选中「生成默认 CODE」字段,在「字段属性 >> 默认值」处,设置默认值为「公式编辑」,点击下方「编辑公式」:

2)在公式编辑页面,设置「生成默认 CODE」字段的公式如下:

INT(RAND()*(9999-1000)+1000)

表示生成随机的 4 位数。

3.3 设置表单校验

1)在「表单属性 >> 表单提交校验」处,点击下方「添加校验条件」:

2)进入提交校验设置页面,设置不满足校验条件时提示文字为:「验证码不一致!」;设置公式如下:

请输入验证码==生成默认CODE

3.4 设置字段显隐规则

1)对于表单中的辅助字段「生成默认CODE」,可以在「字段属性 >> 字段权限」处设置字段为不可见:

2)在「表单属性 >> 不可见字段赋值」处,设置赋值规则为「始终重新计算」:

4. 前端事件设置

4.1 配置入口

添加好了以后,即可在表单属性中配置前端事件:

4.2 设置事件名称&说明

添加好前端事件后,首先设置前端事件的基础信息,即事件名称和事件说明,用于区分前端事件:

4.3 设置触发动作

设置触发动作:触发字段选择「获取验证码」字段。

4.4 设置执行动作

根据【2.2 接口分析】章节,设置执行动作如下:

  • 执行动作类型:自定义请求
  • 请求类型:POST
  • URL设置为:
https://dfsns.market.alicloudapi.com/data/send_sms

Hearder/Body设置:

  • Hearder:Authorization=APPCODE+英文空格+自己的 APPCODE

注:可以在 云市场 已购买的服务中看到我们购买的接口,并获取对应的 APPCODE。

  • Body:x-www-form-urlencoded

name

value

content

code:「生成默认CODE」字段

phone_number

「手机号码」字段

template_id

TPL_0000

注:value 的值从右侧「插入字段」中选择。

全部设置完成记得点击「确定」进行保存。

4.5 设置返回值

此接口不需要设置返回值。

5. 保存与调试

1)按照上述步骤,已完成前端事件的全部设置,接下来点击「保存并调试」,可进入调试,检查配置有无问题。

2)填写手机号码,然后点击底部「发送请求」,即可看到返回内容与正常返回示例一致,即配置成功。

文档内容是否对您有帮助?
有帮助
没帮助没帮助
如需获取即时帮助,请联系技术支持
咨询
扫码领取100+零代码资料简道云官方微信号400-111-0890
图标在线咨询
立即体验