> Java > java지도 시간 > 본문

Java 및 JavaScript 프런트엔드 및 백엔드에서 휴대폰 번호 인증 코드를 사용하여 원클릭 등록 및 로그인을 구현하는 방법

WBOY
풀어 주다: 2023-05-03 08:46:06
앞으로
1919명이 탐색했습니다.

1. 원클릭 등록 및 로그인 프로세스

Java 및 JavaScript 프런트엔드 및 백엔드에서 휴대폰 번호 인증 코드를 사용하여 원클릭 등록 및 로그인을 구현하는 방법

2. 프론트 엔드

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. 백엔드 인증코드

3.1. 전처리

잦은 인증코드 획득으로 인한 잘못된 연산을 방지하기 위해 인증코드 획득 로직이 사전 차단 처리가 필요합니다.

사용자 IP에 따라 제한되어 60초 이내에 인증코드 1개만 받을 수 있도록 제한

먼저 입력 -> 인증코드 사전 차단 처리:

1. 사용자 IP 가져오기

2. 인증코드를 redis로 저장하세요. prefix + redis에서 사용자의 IP를 키로 가져오고 redis

  • 에서 저장된 요청 요청 IP를 가져옵니다. Redis에 만료되지 않은 사용자 요청 IP가 있는 경우 "SMS가 너무 빨리 전송되었습니다. 다시 시도하세요."라는 메시지가 표시됩니다. 나중에! "

  • 사용자 요청 IP가 Redis에 없으면 허용되고 계속해서 확인 코드 가져오기 인터페이스 api

Java 및 JavaScript 프런트엔드 및 백엔드에서 휴대폰 번호 인증 코드를 사용하여 원클릭 등록 및 로그인을 구현하는 방법

3.2. 인터셉터 추가

Java 및 JavaScript 프런트엔드 및 백엔드에서 휴대폰 번호 인증 코드를 사용하여 원클릭 등록 및 로그인을 구현하는 방법

3.3. 인증 코드 받기

1. 입력란에 입력된 데이터를 확인하세요. 불법이면 계속 진행하세요.

2. 사용자가 요청한 IP를 얻습니다

3. 사용자의 IP를 기준으로 제한하여 60초 내에 하나의 인증 코드만 받도록 제한합니다.

4. Tencent에 전화하세요. /알리바바 SMS 서비스, 인증코드 전송

6. 후속 인증을 위해 인증코드를 Redis에 입력하세요

7. 인증코드 반환

위 내용은 Java 및 JavaScript 프런트엔드 및 백엔드에서 휴대폰 번호 인증 코드를 사용하여 원클릭 등록 및 로그인을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:yisu.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿