diff --git a/.gitignore b/.gitignore index 4d29575..532eddc 100644 --- a/.gitignore +++ b/.gitignore @@ -21,3 +21,5 @@ npm-debug.log* yarn-debug.log* yarn-error.log* + +.env \ No newline at end of file diff --git a/src/components/join/EmailCheck.jsx b/src/components/join/EmailCheck.jsx index a0d4924..92339a9 100644 --- a/src/components/join/EmailCheck.jsx +++ b/src/components/join/EmailCheck.jsx @@ -8,28 +8,38 @@ export default function EmailCheck({ email, setEmail }) { const emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; // 이메일 조건 const [isValid, setIsValid] = useState(true); // 유효성 검사 + const [isDuplicate, setIsDuplicate] = useState(true); // 중복 검사 const handleCheckEmail = async () => { const isValidCheck = emailRegex.test(email); - setIsValid(isValidCheck); + setIsValid(isValidCheck); // 유효성 검사 통과 if (!emailRegex.test(email)) { openModal(); - } else { - try { - const response = await axios.get(`/joinform/api/signup/mailcheck`, { - params: { email: email }, - }); - - if (response.status === 200) { - alert("확인되었습니다."); - } else if (response.status === 400) { + return; + } + + try { + const response = await axios.get( + `${process.env.REACT_APP_API_BASE_URL}/joinform/api/signup/mailcheck`, + { + params: { mail: email }, + } + ); + + if (response.status === 200) { + if (response.data.code === 200) { + // 중복 이메일 없을 때 + setIsDuplicate(true); + openModal(); + } else if (response.data.code === 400) { + // 중복 이메일이 존재할 때 + setIsDuplicate(false); openModal(); } - } catch (error) { - console.error("Error checking email:", error); - openModal(); } + } catch (error) { + console.error("error: ", error); } }; @@ -64,7 +74,9 @@ export default function EmailCheck({ email, setEmail }) {
{isValid - ? "중복된 이메일이 존재합니다. 다른 이메일을 입력해주세요." + ? isDuplicate + ? "확인되었습니다" + : "중복된 이메일이 존재합니다" : "이메일 형식이 올바르지 않습니다."}
diff --git a/src/components/join/JoinForm.jsx b/src/components/join/JoinForm.jsx index ff41b9b..ba2d195 100644 --- a/src/components/join/JoinForm.jsx +++ b/src/components/join/JoinForm.jsx @@ -42,11 +42,14 @@ export default function JoinForm() { openModal(); } else { try { - const response = await axios.post(`/joinform/api/signup`, { - usermail: email, - password: password, - nickname: nickname, - }); + const response = await axios.post( + `${process.env.REACT_APP_API_BASE_URL}/joinform/api/signup`, + { + usermail: email, + password: password, + nickname: nickname, + } + ); if (response.status === 200 && response.data.code === 200) { navigate("/joinend"); diff --git a/src/components/join/NicknameCheck.jsx b/src/components/join/NicknameCheck.jsx index 44544cb..1b66b29 100644 --- a/src/components/join/NicknameCheck.jsx +++ b/src/components/join/NicknameCheck.jsx @@ -9,6 +9,7 @@ export default function NicknameCheck({ nickname, setNickname }) { // 아이디 중복 확인 const nicknameRegex = /^[a-zA-Z0-9]{1,5}$/; const [isValid, setIsValid] = useState(true); // 유효성 검사 + const [isDuplicate, setIsDuplicate] = useState(true); // 중복 검사 const handleNickname = async () => { const checkedNickname = nicknameRegex.test(nickname); // 유효성 검사한 닉네임 @@ -17,21 +18,27 @@ export default function NicknameCheck({ nickname, setNickname }) { if (!nicknameRegex.test(nickname)) { openModal(); - } else { - try { - const response = await axios.get(`/joinform/api/signup/nicknamecheck`, { - params: { nickname: nickname }, - }); + } - if (response.status === 200) { - alert("확인되었습니다."); - } else if (response.status === 400) { - openModal(); + try { + const response = await axios.get( + `${process.env.REACT_APP_API_BASE_URL}/joinform/api/signup/nicknamecheck`, + { + params: { nickname: nickname }, } - } catch (error) { - console.error("Error checking nickname:", error); + ); + + if (response.status === 200) { + // 중복 닉네임 없을 때 + setIsDuplicate(true); + openModal(); + } else if (response.status === 400) { + // 중복 닉네임 있을 때 + setIsDuplicate(false); openModal(); } + } catch (error) { + console.error("error: ", error); } }; @@ -39,11 +46,11 @@ export default function NicknameCheck({ nickname, setNickname }) { <>
setNickname(e.target.value)} /> @@ -58,13 +65,15 @@ export default function NicknameCheck({ nickname, setNickname }) { - {/* 아이디 중복 확인 modal */} + {/* 닉네임 중복 확인 modal */}
{isValid - ? "닉네임이 중복됩니다. 다른 닉네임을 입력해주세요." + ? isDuplicate + ? "확인되었습니다" + : "닉네임이 중복됩니다. 다른 닉네임을 입력해주세요." : "잘못된 형식의 닉네임입니다."}