手机短信验证码登录

news2025/2/23 4:30:34

用户需求:

1、用户使用手机号和短信验证码登录系统

2、未注册过的手机号再登录时实现自动注册

3、新注册的账号只有7天的使用时间,过期后不允许进行登录

功能需求:

登录页面设计

图1.手机号登录

【验证码登录】规则说明:

1、手机号输入框,默认提示文案:请输入手机号。

2、验证码输入框,默认提示文案:请输入验证码。

3、获取验证码按钮默认置灰。

4、隐私政策复选框,默认未选中。

5、点击协议、政策,新开页面,进入对应页面。

6、登录按钮默认置灰。手机号和验证码输入满足条件时,按钮点亮。

7、点击注册,当前页面打开,进入注册页面。

【发送验证码】规则说明:

1、手机号满足输入条件,发送验证码按钮点亮

2、点击发送验证码,弹出防盗刷验证弹框,防盗刷使用第三方服务,具体逻辑参考服务提供方的接口文档。

3、通过弹框验证,发送验证码按钮文案改为120秒倒计时。倒计时期间不允许点击。

4、倒计时完成,按钮改为重新发送。点击重新发送,再次弹出防盗刷验证。

5、验证码有效期为180秒,重新发送后,上个验证码自动失效。

6、验证码接口根据IP地址限流,每个IP地址在120秒内可以调用两次发送接口。

7、接口限流后提示文案:操作过频繁请稍后再试

8、发送验证码前判断手机号是否已注册账号并且账号过期。若账号已过期则提示:账号已过期

图2.放到刷验证弹框

【手机号格式】判断规则:

1、判断时间:输入框有输入数据,失去焦点时判断手机号格式

2、手机号格式:国内已1开头的11位数字。若是国外手机号则不判断格式

3、错误提示:手机号格式不正确。样式参考页面原型

【验证码格式】判断规则:

1、判断时间:输入框有输入数据,失去焦点时。

2、验证码格式:6位数字

3、错误提示:验证码为6位数字。样式参考页面原型

【点击登录】规则说明:

点击登录按钮

1、为勾选同意协议,弹出同意协议气泡提示。

2、已勾选协议,判断验证码是否正确。

①不正确,显示错误提示:验证码错误,请重新输入。

②正确,判断账号是否注册

3、判断账号是否注册

①已注册,登录成功,进入首页

②未注册,创建用户信息存入数据库,进入首页

【验证码防盗刷】规则说明:

开发任务

前端开发任务

1、修改登录页面

2、实现防盗刷弹框和倒计时等页面控制逻辑

3、调用验证码发送接口和登录接口

后端开发任务

1、实现接口限流控制

2、提供验证码发送接口和登录接口

3、对接第三方验证码平台

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1816671.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【three.js】设置three.js全屏展示,并解决大小动态变化

目录 一、设置全屏 二、canvas画布宽高度动态变化 一、设置全屏 这个很简单,直接用代码读取当前全屏需要的长宽即可。 const width = window.innerWidth; //窗口文档显示区的宽度作为画布宽度 const height = window.innerHeight; //窗口文档显示区的高度作为画布高度 二、…

水帘降温水温

不同环境下的水帘啊,使用水温是不一样的,夏天使用水疗的水有两种,一个是常温的循环水,20~26左右,另外一个呢,就是深井水,重点是啥呢?就是无论我们用哪一种,能够把温度降到…

计算机网络(4) 最长前缀匹配(路由转发表)

一.路由转发 网络数据包IP段只包含源地址与目的地址,经过数据链路层包装与物理层信号形式转换,最终经由不同的链路节点到达目的地址。这个过程是一步一步(hop by hop)进行的,路过一个路由节点则称为一跳。每个路由节点…

绘唐一键追爆款3正式版

【绘唐2一键追爆款】 这是一个关于追求梦想的故事,讲述了一个普通人如何利用一键追爆款的技巧,成功打造自己的事业的动人故事。 主人公小明是一个市井小民,生活过得平凡无奇。他一直怀揣着一个梦想,希望能够通过自己的努力&#x…

Stable Diffusion: ControlNet Openpose

上一文已经介绍了ControlNet的安装,点击右边的三角箭头。 拖放原始姿态图片。 勾选“启用”,“完美像素模式”,“允许预览” 控制类型选择“OpenPose(姿态)” 预处理器选“openpose_full”,会对原始姿态图片做整体分…

【C++】编译

三、C编译 前面给大家演示了如何从写C代码到编译代码再到执行代码的全过程。这个过程中非常重要的编译环节,被我们一个按钮或者一个ctrlF7快捷键就给带过了。其实这个环节非常重要,如果你非常了解这个环节,你开发源代码就会更加自信和清醒&a…

Java基础面试重点-1

0. 符号: *:记忆模糊,验证后特别标注的知识点。 &:容易忘记知识点。 *:重要的知识点。 1. 简述一下Java面向对象的基本特征(四个),以及你自己的应用? 抽象&#…

c#调用c++dll方法

添加dll文件到debug目录,c#生成的exe的相同目录 就可以直接使用了,放在构造函数里面测试

【git使用四】git分支理解与操作(详解)

目录 (1)理解git分支 主分支(主线) 功能分支 主线和分支关系 将分支合并到主分支 快速合并 非快速合并 git代码管理流程 (2)理解git提交对象 提交对象与commitID Git如何保存数据 示例讲解 &a…

CorelDRAW2024官方最新中文破解版Crack安装包网盘下载安装方法

在设计的世界里,软件工具的更新与升级总是令人瞩目的焦点。近期,CorelDRAW 2024中文版及其终身永久版的发布,以及中文破解版Crack的出现,再次掀起了设计圈的热潮。对于追求专业精确的设计师而言,了解这些版本的下载安装…

Jemeter做性能测试

目录 1. 测试计划 2. 线程组 3. HTTP请求 4. 查看结果树 5. 聚合报告 【要求】 用JMeter取样器,实现对云边AI (qinzhi.xyz)的访问 【步骤】 1. 测试计划 2. 线程组 右击测试计划——添加——线程(用户)——线程组 3. HTTP请求 右击线程组——添加——取样…

鸿蒙轻内核A核源码分析系列五 虚实映射(6)虚拟映射修改转移

6.1 映射属性修改函数LOS_ArchMmuChangeProt 函数LOS_ArchMmuChangeProt用于修改进程空间虚拟地址区间的映射保护属性,其中参数archMmu为进程空间的MMU结构体,vaddr为虚拟地址,count为映射的页数,flags为映射使用的新标签属性信息…

easyrecovery专业版破解无需注册绿色版免费下载 easyrecovery16数据恢复软件永久激活码密钥百度网盘crack文件

EasyRecovery (易恢复中国)是由全球著名数据厂商Ontrack 出品的一款数据文件恢复软件。支持恢复不同存储介质数据:硬盘、光盘、U盘/移动硬盘、数码相机、Raid文件恢复等,能恢复包括文档、表格、图片、音视频等各种文件。 开发背景…

【网络安全的神秘世界】2024.6.6 Docker镜像停服?解决最近Docker镜像无法拉取问题

🌝博客主页:泥菩萨 💖专栏:Linux探索之旅 | 网络安全的神秘世界 | 专接本 解决Docker镜像无法拉取问题 🙋‍♂️问题描述 常用镜像站:阿里云、科大、南大、上交等,全部挂掉 执行docker pull命…

手机数据删除很意外?失而复得,2个技巧揭晓

在这个快节奏的时代,手机就像是我们的“第二心脏”,不仅用来跟人聊天,还藏着我们的秘密宝藏——个人数据。但有时候,手一抖,心一慌,重要数据就消失了!是不是感觉天都要塌下来了?别怕…

翻译: Gen AI生成式人工智能学习资源路线图一

Introduction 介绍 本文档旨在作为学习现代人工智能系统背后的关键概念的手册。考虑到人工智能最近的发展速度,确实没有一个好的教科书式的资源来快速了解 LLMs 或其他生成模型的最新和最伟大的创新,但互联网上有大量关于这些主题的优秀解释资源&#x…

postman教程-21-Newman运行集合生成测试报告

上一小节我们Postman Newman的安装方法,本小节我们讲解一下Postman Newman的具体使用方法。 使用Newman运行集合 1、导出Postman集合: 在Postman中,选择你想要运行的集合,然后点击“导出”按钮,选择导出为“Collect…

Figma文字标注工具的使用方法是什么?

在UI设计过程中,有一个让设计师头疼的工作环节,那就是文字标注的问题。相信大家对Figma软件都很熟悉,但是这个软件的使用也有自己的缺点,就是文字标注等问题,日常使用自己是做不到的,需要依靠第三方工具来执…

推荐使用三丰云免费云服务器、免费虚拟主机

官网地址:www.sanfengyun.com 三丰云服务器: 配置高:能够轻松运行应用程序和网站,在处理大量请求和保持高可靠性方面表现出色。 易用性好:界面直观、简单,能够轻松管理服务器和资源,快速创建和…

面向计算病理学的通用基础模型| 文献速递-视觉通用模型与疾病诊断

Title 题目 Towards a general-purpose foundation model for computational pathology 面向计算病理学的通用基础模型 01 文献速递介绍 组织图像的定量评估对于计算病理学(CPath)任务至关重要,需要从全幻灯片图像(WSIs&…