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

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

WBOY
WBOY앞으로
2023-05-03 08:46:061872검색

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으로 문의하시기 바랍니다. 삭제