-
Notifications
You must be signed in to change notification settings - Fork 2
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.
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] 로그인 페이지 구현 #286
[Feat] 로그인 페이지 구현 #286
Conversation
🎨 스토리북 확인하기
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
👏
@Post('guest/login') | ||
@Get('guest/login') |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Q:
cors 에러가 발생한다면 main.ts
에서 cors 설정을 진행해주면 되는 것 아닌가요? 메서드를 변경한 이유가 있을까요?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
cors 설정을 해도 해결되지 않는 문제였습니다. 잠깐 알아보니 상당히 복잡하더라구요... 일단 로그인이 지금 저희가 집중해야할 중요한 부분은 아니라고 생각해서 빠른 조치를 취하게 되었습니다. 현재 로그인 방식이 GET에 어울리기도 하구요..!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
https://www.milk717.com/gomterview-2
우연히 발견한게 또 곰터뷰 개발자분의 아티클인데 ㅋㅋㅋ 상당한 트러블 슈팅이 있었던것으로 보입니다 흠 이 부분을 집중해서 해결해봐야할지 고민이 됩니다...
const guestUser = { | ||
username: `guest_${randomNum}`, | ||
password: `guest_password_${randomNum}`, | ||
email: `[email protected]`, | ||
nickname: `guest_${randomNum}`, | ||
introduce: `게스트 사용자입니다. `, | ||
profileImageUrl: `https://cataas.com/cat?${Date.now()}`, | ||
profileImageUrl: catImageUrl, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
p2:
기본 프로필 이미지에 경우 nullable
하게 변경하거나 /
으로 접근시 web/public
의 정적 파일에 접근할 수 있는 것을 이용하는 것은 어떨까요? (ex: /cat-image.png
, vite에 경우 /
로 바로 public 폴더에 접근 가능합니다)
이미지를 가져오기 위해 fetch
요청을 할 이유가 없다고 생각합니다
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
아 이건 여러 게스트 유저를 만들어서 더미를 쌓아놓을 때 기본 이미지보다는 랜덤한 고양이 이미지 들어오는게 단순히 귀엽고 보기 좋을거같아서 넣기는 했습니다 😅 혹시 우려되는 문제가 있을까요? 🥲
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
http 요청으로 인해 성능상 좋지 않을 것으로 생성되지만... 고양이 귀엽죠... 우선 두고 테스트 진행하며 문제 발생시 변경해도 좋을 것 같습니다!!! 고양이 지켜!!
const oauthLogin = async (provider: 'google' | 'github') => { | ||
await axiosInstance.get(`/auth/${provider}/login`); | ||
const guestLogin = () => { | ||
window.location.href = `${ENV.API_URL}/auth/guest/login`; | ||
}; | ||
|
||
export { logIn, signUp, oauthLogin, signOut }; | ||
const oauthLogin = (provider: 'google' | 'github') => { | ||
window.location.href = `${ENV.API_URL}/auth/${provider}/login`; | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
p1:
axios
를 통해 요청을 진행하지 않는건가요? location을 직접 변경하는 이유가 무엇인가요?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
로그인 버튼을 눌렀을 때 해당 주소에서 GET을 해야하기 때문에 axios GET 요청이 아닌 링크 이동으로 구현하게 되었습니다!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
페어프로그래밍을 통한 질문 답변 완료
관련 이슈 번호
작업 내용
PR 포인트
게스트 로그인이 원래 POST로 구현되어있었는데 CORS에러가 나는 문제로 GET으로 변경했습니다.
고민과 학습내용
스크린샷
2024-11-26.3.16.17.mov