Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feat] 로그인 전역 관리 완료, 피드 아이콘 추가, 업로드 아이콘 보내기(#10) #107

Merged
merged 2 commits into from
Dec 2, 2023
Merged

[Feat] 로그인 전역 관리 완료, 피드 아이콘 추가, 업로드 아이콘 보내기(#10) #107

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
83a41b0
[Feat] 로그인 전역 관리 완료, 피드 아이콘 추가, 업로드 아이콘 보내기(#10)
nebulaBdj Dec 2, 2023
63b42a9
Merge pull request #106 from kdt-8-4/73-login_token
nebulaBdj Dec 2, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion next.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

module.exports = {
images: {
domains: ["weatherfit-board-image.s3.amazonaws.com"],
domains: ['weatherfit-board-image.s3.amazonaws.com'],
},
};

Expand Down
31 changes: 25 additions & 6 deletions src/app/detail/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,15 +12,18 @@ import axios from "axios";
import ContentDetail from "@/component/ContentDetail";
import jwt from "jsonwebtoken";
import Cookies from "js-cookie";
import { useRecoilState } from "recoil";
import { useRecoilState, useRecoilValue } from "recoil";
import CommentIcon from "@/component/CommentIcon";
import CategoryDetail from "@/component/CategoryDetail";
import { useRouter } from "next/navigation";
import { editBoardIdState } from "@/recoilAtom/EditDetail";



export default function Detail(): JSX.Element {
const [boardDetail, setBoardDetail] = useState<any>(null);
const [dropdownVisible, setDropdownVisible] = useState(false);
const [dropdownVisible, setDropdownVisible] = useState<boolean>(false);
const [localBoardId, setLocalBoardId] = useState<number | null>(0);
const [editBoardId, setEditBoardId] = useRecoilState(editBoardIdState);

const router = useRouter();
Expand All @@ -35,19 +38,35 @@ export default function Detail(): JSX.Element {
console.log("디코딩", decodedToken);

useEffect(() => {

//여기서 localStorae의 값을 가져와 정수로 바꾸기
const boardId_in = localStorage.getItem("getBoardId_local");
const boardIdNumber = boardId_in ? parseInt(boardId_in) : null;
setLocalBoardId(boardIdNumber);

console.log("정수 변환", boardIdNumber);
console.log("로컬에서 불러온 아이읻", localBoardId);



}, []);

useEffect(()=>{
const fetchData = async () => {
try {
const response = await axios.get(
`https://www.jerneithe.site/board/detail/${boardDetail.boardId}`,
`https://www.jerneithe.site/board/detail/${localBoardId}`,
);
setBoardDetail(response.data);
console.log(response);

} catch (error) {
console.error("Error fetching data:", error);
}
};

};
fetchData();
}, []);
},[localBoardId, setLocalBoardId])

const toggleDropdown = () => {
setDropdownVisible(!dropdownVisible);
Expand Down
183 changes: 153 additions & 30 deletions src/app/register/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { useEffect, useState } from "react";
import InputBar from "@/component/InputBar";
import Menubar from "@/component/MenuBar";
import axios from "axios";
import { METHODS } from "http";

///////////////////////////해야하는 작업/////////////////////////////

Expand All @@ -17,14 +18,22 @@ import axios from "axios";
///////////////////////////////////////////////////////////////////
export default function Register(): JSX.Element {
const [email, setEmail] = useState<string>("");
const [email_code, setEmail_code] = useState<string>("");
const [name, setName] = useState<string>("");
const [nickname, setNickname] = useState<string>("");
const [password, setPassword] = useState<string>("");
const [repassword, setRepassword] = useState<string>("");

//중복검사
const [emailcheck, setEmailCheck] = useState<string>("이메일을 입력하세요");
const [nickname_check, setNickCHeck] = useState<string>("닉네임을 입력하세요");
const [emailcheck, setEmailCheck] = useState<string>("");
const [nickname_check, setNickCHeck] = useState<string>("");

//이메일 인증 인풋바 생성
const [emailCertified, setCertified] = useState<boolean>(false);

//이메일 인증이 되어야만 회원가입 데이터 전송 가능
const [permission, setPermission] = useState<boolean>(false);
const [permission_status, setPstatus] = useState<string>("");

const validateEmail = (inputValue: string) => {
const emailFormat =
Expand All @@ -42,32 +51,110 @@ export default function Register(): JSX.Element {
};

//이메일 중복 검사
const check_email = () => {
console.log("onBlur 잘돌아가는지 확인", email);
const check_email = async() => {
try {
const duplication_email = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/signup/email",
data: {
email : email
},
});

console.log(duplication_email.data.result);

if(duplication_email.data.result) {
setEmailCheck("");
} else {
setEmailCheck("사용할 수 없는 이메일입니다. 다시 입력해주세요.");
}

} catch (error) {
console.log("이메일 데이터를 보내지 못했습니다", error);
}

console.log("onBlur 동작", email);
}

//닉네임 중복 검사
const check_nickname = async() => {
console.log("잘 동작하는지 확인", nickname);
try {

const duplication_nickname = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/signup/nickname",
data: {
nickname: nickname,
},
});


if(duplication_nickname.data.result) {
setNickCHeck("");
} else {
setNickCHeck("사용할 수 없는 닉네임입니다. 다시 입력해주세요.");
}

} catch (error) {
console.log("닉네임 데이터를 보내지 못했습니다", nickname,error);
}


}

//이메일 전송
const verify_btn = async () => {
console.log("Verify 버튼이 클릭되었습니다.");

const verify_email = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/profile",
data: email,
});
try {
const verify_email = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/signup/email/send",
data: {email},
});

console.log(verify_email.data);

if(verify_email.data.result){
setCertified(true);
}else{
setCertified(false);
}

} catch (error) {
console.log("이메일 인증 코드 전송 실패", error);
}
};

const caster_register = async () => {
// const req_regdata = {
// email : email,
// name : name,
// nickname : nickname,
// password : password,
// };
//이메일 인증 코드 수신 후 전송
const code_btn = async() => {
try {
const send_code = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/signup/email/verify",
data: {
email: email,
code: email_code,
}
});
console.log(send_code.data);
if(send_code.data.result){
setPstatus("인증 성공!");
setPermission(true);
}else{
setPstatus("인증코드가 일치하지 않습니다.");
setPermission(false);
}

console.log("permission", permission);
} catch (error) {
console.log("이메일 인증 실패", error);
}
}


// console.log("데이터 확인", req_regdata);
const caster_register = async () => {

console.log(
email,
Expand All @@ -76,18 +163,26 @@ export default function Register(): JSX.Element {
password
)

const register_data = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/api/signup",
data : {
email : email,
name : name,
nickname : nickname,
password : password
if(permission){
try {
const register_data = await axios({
method: "POST",
url: "https://www.jerneithe.site/user/api/signup",
data : {
email : email,
name : name,
nickname : nickname,
password : password
}
});

console.log("회원가입 됐는지 확인", register_data);

} catch (error) {
console.log("이메일 인증에 실패했기 떄문에 회원가입 불가",error);
}
});

console.log("회원가입 됐는지 확인", register_data);
}

};

return (
Expand All @@ -107,7 +202,7 @@ export default function Register(): JSX.Element {
label="이메일"
id="email"
type="email"
placeholder={emailcheck}
placeholder="이메일을 입력하세요"
value={email}
onChange={(value: string) => setEmail(value)}
onBlur={check_email}
Expand All @@ -117,17 +212,45 @@ export default function Register(): JSX.Element {
onButtonClick={verify_btn}
autoFocus
/>
<div className="permission_msg">
{emailcheck}
</div>

{/* 이메일 인증 코드 입력 인풋바 */}
{emailCertified ?
<InputBar
label="이메일 인증 코드"
id="email_code"
type="text"
placeholder="인증코드을 입력하세요"
value={email_code}
onChange={(value: string) => setEmail_code(value)}
button // 버튼을 사용한다고 명시
buttonId="btn_code"
buttonText="전송"
onButtonClick={code_btn}
autoFocus
/> :
<div></div>
}
<div className="permission_msg">
{permission_status}
</div>

{/* 닉네임 👉🏻 중복검사*/}
<InputBar
label="닉네임"
id="nickname"
type="text"
placeholder={nickname_check}
placeholder="닉네임을 입력하세요"
value={nickname}
onChange={(value: string) => setNickname(value)}
onBlur={check_nickname}
autoFocus
/>
<div className="permission_msg">
{nickname_check}
</div>

{/* 이름*/}
<InputBar
Expand Down
2 changes: 1 addition & 1 deletion src/app/socialregister/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export default function CompleteProfile() {
useEffect(()=>{
const url = new URL(window.location.href);
const hashParams = new URLSearchParams(url.hash.substring(1));
const callback_token = hashParams.get("access_token");
const callback_token = hashParams.get("state");
setGoogle(callback_token);
},[]);

Expand Down
9 changes: 9 additions & 0 deletions src/app/upload/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ import Cookies from "js-cookie";
import { categories } from "@/component/category";
import axios from "axios";
import { Login_token } from "@/recoilAtom/Login_token";
import { WeatherIcons } from "@/recoilAtom/WeatherIcon";
import { TemNowControl } from "@/recoilAtom/TemNow";
import { useRecoilState } from "recoil";
import Image from "next/image";
import Link from "next/link";
Expand All @@ -26,6 +28,9 @@ export default function Upload(): JSX.Element {
Record<string, string[]>
>({});
const [token, setToken] = useRecoilState(Login_token);
//openweathermap에서 제공하는 icon과 현재 온도
const [icon, setIcon] = useRecoilState(WeatherIcons);
const [usetemp, setTemp] = useRecoilState(TemNowControl);

// 로그인 확인 후 페이지 로드
const [logincheck, setCheck] = useState<boolean>(false);
Expand Down Expand Up @@ -88,6 +93,8 @@ export default function Upload(): JSX.Element {
hashTag: hashtags,
category: allSelectedSubCategories,
content: content,
temperature: usetemp,
weatherIcon: `https://openweathermap.org/img/wn/${icon}.png`,
};

formData.append("board", JSON.stringify(boardData));
Expand Down Expand Up @@ -115,6 +122,8 @@ export default function Upload(): JSX.Element {

console.log("로그인 토큰 존재 확인", logincheck);
console.log("로그인 토큰 값", logintoken);
console.log("icon", icon);
console.log("온도", usetemp);

return (<>
{logincheck ?
Expand Down
Loading