import React, { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import { getAuth, RecaptchaVerifier, signInWithPhoneNumber } from "firebase/auth";
import { app } from "../firebase"; // Firebase 설정 파일에서 가져오기

function Signup() {
const navigate = useNavigate();
const [error, setError] = useState({});
const [handleSubmited, setHandleSubmited] = useState(false);
const [formData, setFormData] = useState({});
const [confirmationResult, setConfirmationResult] = useState(null); // 인증 결과를 저장할 상태

const auth = getAuth(app);
auth.languageCode = 'ko';




const handleSendCode = () => {
if (!formData.phonenumber) {
setError({ ...error, message: "휴대폰 번호를 입력해 주세요" });
return;
}

const phoneNumber = `+82${formData.phonenumber.replace(/^0/, '')}`;
console.log(phoneNumber)

const recaptchaVerifier = new RecaptchaVerifier(auth,
'recaptcha-container',
{
size : 'invisible',
callback : (response) => {
// ReCAPTCHA가 성공적으로 완료되었을 때 호출됩니다.
console.log('ReCAPTCHA 성공');
},
'expired-callback': () => {
// ReCAPTCHA가 만료되었을 때 호출됩니다.
console.log('ReCAPTCHA 만료');
}
},
);

signInWithPhoneNumber(auth, phoneNumber, recaptchaVerifier)
.then((confirmationResult) => {
// SMS 인증 코드 발송 성공
setConfirmationResult(confirmationResult);
console.log('SMS 발송 성공');
})
.catch((error) => {
// SMS 인증 코드 발송 실패
console.error('SMS 발송 실패', error);
setError({ ...error, message: "SMS 발송에 실패했습니다." });
});
};

~~~~ ㅇ~~~~
~~~~ ㅇ~~~~~~~~ ㅇ~~~~~~~~ ㅇ~~~~~~~~ ㅇ~~~~~~~~ ㅇ~~~~~~~~ ㅇ~~~~


<button type="button" onClick={handleSendCode}>SMS 전송</button>

<div id="recaptcha-container"></div> {/* ReCAPTCHA 컨테이너 */}


1.SMS전송 클릭시

2.recaptcha 실행

3.인증번호 발송됨


- 콘솔창

ReCAPTCHA 성공

Signup.js:89 SMS 발송 성공


이렇게 나옴, 근데 문자는 안옴