Java与JavaScript前后端实现手机号验证码一键注册登陆抖音流程

目录
  • 一、一键注册登录流程
  • 二、前端
    • 2.1. 验证码获取流程
    • 2.2. 验证码获取代码
  • 三、后端验证码
    • 3.1. 前置处理
    • 3.2. 拦截器添加
    • 3.3. 获取验证码

一、一键注册登录流程

二、前端

2.1. 验证码获取流程

1.点击->获取验证码调用后端获取验证码api接口

2.验证码59秒倒计时

3.重复点击获取验证码,判断验证码倒计时是否大于0:

  • 如果大于0,获取验证码按钮不可触摸
  • 如果等于0,获取验证码调用后端获取验证码api接口

2.2. 验证码获取代码

	var serverUrl = app.globalData.serverUrl;
				// 调用后端发送验证码
				uni.request({
					method: "POST",
					url: serverUrl + "/passport/getSMSCode?mobile=" + mobile,
					success(result) {
						var status = result.data.status;
						if (status != 200) {
							uni.showToast({
								title: result.data.msg,
								icon: "none"
							});
						}
						// 开始倒数60秒限制
						if(me.codeTimes == 0) {
							me.doTimer(59);
						}
					}
				});
			},
			// 发送验证码的倒计时方法
			doTimer(times) {
				var me = this;
				// 倒计时定时器
				var sendCodeBtnFunction = function(){
					var left = times--;
					if (left <= 0) {
						me.codeTouched = false;
						me.codeBtnText = "发送验证码";
						clearInterval(smsTimer);
					} else {
						me.codeBtnText = left + "s";
					}
					me.codeTimes = left;
				};
				var smsTimer = setInterval(sendCodeBtnFunction, 1000);
			},

三、后端验证码

3.1. 前置处理

由于为了避免频繁获取验证码导致无效的操作,因此,对验证码获取逻辑需要进行前置拦截处理。

根据用户ip进行限制,限制用户在60秒之内只能获得一次验证码

先进入->验证码前置拦截处理:

1.获取用户的ip

2.验证码redis存储key的前缀+获取用户的ip当做redis中的key,从redis中获取已经存储的请求请求ip

  • 如果redis中存在未过期的用户请求ip,则提示"短信发送太快啦~请稍后再试!"
  • 如果redis中,不存在用户请求ip,则放行,继续调用获取验证码接口api

3.2. 拦截器添加

3.3. 获取验证码

1.对输入框填写的数据进行校验,不合法则提示,合法继续。

2.获得用户请求ip

3.根据用户ip进行限制,限制用户在60秒之内只能获得一次验证码

4.生成随机6位验证码

5.调用腾讯/阿里短信服务,发送验证码

6.把验证码放入到redis中,用于后续的验证

7.返回验证码

到此这篇关于Java详解手机号验证码一键注册登陆抖音流程的文章就介绍到这了,更多相关Java注册登陆内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

时间: 2022-06-22

java实现抖音代码舞源码

本文实例为大家分享了java实现抖音代码舞源码,供大家参考,具体内容如下 Client.java package com.dance; import java.awt.Container; import java.awt.EventQueue; import java.awt.Toolkit; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.awt.image.Buffere

java实现抖音飞机大作战

本文实例为大家分享了java抖音飞机大作战的具体代码,供大家参考,具体内容如下 Airplane.java package zmf.game.shoot; import java.util.Random; /** * @author jcf * @Description: Airplane----敌机既是飞行物 * @date 2018-03-28 11:17:16 */ public class Airplane extends FlyingObject implements Enemy{ /

Java实现超简单抖音去水印的示例详解

目录 一.前言 二.原理与步骤 三.代码实现 四.总结 一.前言 抖音去水印方法很简单,以前一直没有去研究,以为搞个去水印还要用到算法去除,直到动手的时候才发现这么简单,不用编程基础都能做. 二.原理与步骤 其实抖音它是有一个隐藏无水印地址的,只要我们找到那个地址就可以了 1.我们在抖音找一个想要去水印的视频链接 注意:这里一定要是https开头的,不是口令 打开浏览器访问: 访问之后会重定向到这个地址,后面有一串数字,这个就是视频的id,他是根据这个唯一id来找到视频播放的 按F12查看网络请

Java用20行代码实现抖音小视频批量转换为gif动态图

本文主要介绍了Java用20行代码实现抖音小视频批量转换为gif动态图,分享给大家,具体如下: 效果图 本功能实现需要用到第三方jar包 jave,JAVE 是java调用FFmpeg的封装工具. spring boot项目pom文件中添加以下依赖 <!-- https://mvnrepository.com/artifact/ws.schild/jave-core --> <dependency> <groupId>ws.schild</groupId>

PHP基于关联数组20行代码搞定约瑟夫问题示例

本文实例讲述了PHP基于关联数组20行代码搞定约瑟夫问题.分享给大家供大家参考,具体如下: 记得前段时间一写做java开发的兄弟对我说他java60行做了个约瑟夫问题,挺不错的.调侃php应该写这个挺不行的. 于是 呵呵... 洋洋洒洒 20行,写完自己都有些不相信了.哈哈 让不了解php的见识哈php的快捷轻便之处. ps:其实个人挺反感用代码行数来衡量代码数量的,感觉常把代码行数挂嘴边的大多无奈装2.此文仅属闲余娱乐. 回顾一下约瑟夫问题:N个人围成一圈,从第一个开始报数,第M个将被杀掉,最

不到20行代码用Python做一个智能聊天机器人

伴随着自然语言技术和机器学习技术的发展,越来越多的有意思的自然语言小项目呈现在大家的眼前,聊天机器人就是其中最典型的应用,今天小编就带领大家用不到20行代码,运用两种方式搭建属于自己的聊天机器人. 1.神器wxpy库 首先,小编先向大家介绍一下本次运用到的python库,本次项目主要运用到的库有wxpy和chatterbot. wxpy是在 itchat库 的基础上,通过大量接口优化,让模块变得简单易用,并进行了功能上的扩展.什么是接口优化呢,简单来说就是用户直接调用函数,并输入几个参数,就可以

python随机生成大小写字母数字混合密码(仅20行代码)

用简单的方法生成随机性较大的密码 仅用20行代码随机生成密码 核心思路:利用random模块 random模块随机生成数字,大小写字母,循环次数 while循环+随机生成的循环次数-->随机plus++ 大写字母ASKII码在65-90之间 小写字母Askll码在97-122之间 最终效果: x个大写字母+y个数字+z个小写字母(x,y,z均随机) 随机性相较于以往单调的 小写+数字+大写+小写+数字+大写- 循环有所提升 import random print("随机数生成") time

Python使用20行代码实现微信聊天机器人

近来,打开微信群发消息,就会秒收到一些活跃分子的回复,有的时候感觉对方回答很在理,但是有的时候发现对方的回答其实是驴唇不对马嘴,仔细深究发现,原来对方是机器人.今天,小编就带大家用20行代码,带你一起打造一个微信聊天机器人,让你的微信群一直嗨不停~~ 首先我们需要安装一个微信相关的第三方库,itchat,在Windows上通过命令:pip install itchat,就可以将其安装. 其二,我们需要去图灵机器人官网:http://www.tuling123.com,注册一下,即可获得一个机器人

微信小程序仿抖音短视频切换效果的实例代码

一直以为抖音短视频切换假如用小程序做的话应该是比较简单的,直接用swiper实现就好,但在实际写的过程中才发现没那么简单,要控制的逻辑还是挺多的. 还是先看效果 体验路径 自定义组件系列>>仿抖音短视频切换 代码逻辑 直接调用自定义的swiper组件就好 调用代码 js const videoList = [] Page({ data: { videoList, activeId:2, isPlaying:true }, onLoad() { var that = this wx.getSys

Android 实现抖音小游戏潜艇大挑战的思路详解

<潜水艇大挑战>是抖音上的一款小游戏,以面部识别来驱动潜艇通过障碍物,最近特别火爆,相信很多人都玩过. 一时兴起自己用Android自定义View也撸了一个,发现只要有好的创意,不用高深的技术照样可以开发出好玩的应用.开发过程现拿出来与大家分享一下. 项目地址: https://github.com/vitaviva/ugame 基本思路 整个游戏视图可以分成三层: camera(相机):处理相机的preview以及人脸识别 background(后景):处理障碍物相关逻辑 foregroun

Python 利用scrapy爬虫通过短短50行代码下载整站短视频

近日,有朋友向我求助一件小事儿,他在一个短视频app上看到一个好玩儿的段子,想下载下来,可死活找不到下载的方法.这忙我得帮,少不得就抓包分析了一下这个app,找到了视频的下载链接,帮他解决了这个小问题. 因为这个事儿,勾起了我另一个念头,这不最近一直想把python爬虫方面的知识梳理梳理吗,干脆借机行事,正凑着短视频火热的势头,做一个短视频的爬虫好了,中间用到什么知识就理一理. 我喜欢把事情说得很直白,如果恰好有初入门的朋友想了解爬虫的技术,可以将就看看,或许对你的认识会有提升.如果有高手路过,

抖音vbs表白代码大全 抖音vbscript表白代码使用方法

当然斗音很热,这篇文章也有蹭热度的嫌疑. 我们以前就收录了类似这样的属于恶作剧的代码,其实就是判读如果不是你想要的结果就是死循环. 抖音vbs表白代码制作教程 步骤一: 在电脑上新建一个txt文件. 步骤二: 打开txt文件,复制以下代码粘贴进去(可以修改中文部分,其它代码不要动!).保存并关闭txt文件. Set Seven = WScript.CreateObject("WScript.Shell") strDesktop = Seven.SpecialFolders("

golang利用不到20行代码实现路由调度详解

前言 本文主要介绍了关于golang实现路由调度的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧 项目地址 github (本地下载) 本项目依赖 使用标准库实现,无额外依赖 为什么需要路由调度层 golang http标准库只能精确匹配请求的URI,然后执行handler.现在一般web项目都至少有个Controller层,以struct实现,根据不同的请求路径派发到不同的方法中去. 路由调度器定义 由于golang暂时还不可以动态创建对象(比如java的Class.

只需20行代码就可以写出CSS覆盖率测试脚本

document.styleSheets里保存了当前页面上所有CSS规则的集合.通过它可以遍历出页面<style>里定义的所有selector,访问selectorText属性可得选择器的匹配规则.然后将规则规则传递给 document.querySelectorAll 即可获取页面内匹配此规则的元素列表. 这里我们只求CSS规则的覆盖率,所以访问 querySelectorAll().length 即可.通过排序就可看出各个CSS使用情况. 代码很简单. 复制代码 代码如下: var usa