카카오 소셜로그인을 성공했을 때, 다음과 같은 처리를 했었다.
신규 사용자 -> 회원가입 처리
기존 사용자 -> 로그인 성공
KOE320이라는 오류에 대해
동일한 인가 코드를 두 번 이상 사용하거나, 이미 만료된 인가 코드를 사용한 경우, 혹은 인가 코드를 찾을 수 없는 경우가 원인 이라는 블로그를 매우 많이 봤지만 이 내용만으로는 해결할 수 없었다.
프론트엔드 코드, 백엔드 코드 둘 다 콘솔 로그를 찍어봤지만 두 번 요청을 보내는 경우는 없었고,
머리 싸매고 있다가 시간을 너무 오래 잡아먹는 것 같아서 Kakao Developers Dev Talk에 글을 남겼다.
아침에 남겼는데 당일날 30분 안쪽으로 엄청 빠른 답변을 주셨음!!!
리다이렉트 URI에 전달한 인가코드에 하이픈이 있으면, 제거하고 액세스 토큰 발급 요청을 한 것으로 보입니다.
검토 부탁드려요.
클라이언트에서 요청을 보낸 뒤 처리 과정에서 뒤 하이픈이 사라지고 있었다.
router.get('/kakao/callback',
(req, res, next) => {
// 원본 URL에서 코드를 그대로 사용
const code = req.url.split('code=')[1]?.split('&')[0];
if (code) {
req.query.code = code; // 원본 코드를 그대로 사용
}
console.log('Original URL code:', code);
next();
},
passport.authenticate('kakao', {
session: false,
failureRedirect: '/login'
}),
handleLoginCallbackResponse
);
그래서 수정한 Express 코드는 다음과 같음.
같이 협업을 진행하는 프론트엔드 개발자가 URI 인코딩 처리를 안했던 걸 확인하고 조금 더 인가 코드의 형식을 안정적으로 유지하기 위해서, encodeURIComponent를 사용해 code를 인코딩해줬다.
const encodedCode = encodeURIComponent(code);
const response = await axiosInstance.get(`/api/auth/kakao/callback?code=${encodedCode}`);
이 이후로는 한 번도 KOE320 오류가 발생하지 않는다..............
비슷한 오류를 겪는 사람들에게 많은 도움이 되길!
+) 동일한 KOE320이지만 이 문제로도 해결이 되지 않는다면 이 문서를 읽어보면 많은 도움이 될 것 같다!
나 같은 경우는 이 문서를 먼저 읽고 해결이 되지 않아 Devtalk에 글을 작성했었다... 정 해결이 되지 않는다면 데브톡에 글을 남기는게 빠른 해결책인 것 같음 ㅎㅎ
'주절주절.ZIP' 카테고리의 다른 글
[알쓸개잡] 개발자의 구글링 꿀팁.ZIP (4) | 2024.12.28 |
---|---|
Android와 iOS의 서로 다른 SSL 인증서 체인 검증 방식.ZIP (feat. React Native FETCH_ERROR) (0) | 2024.11.06 |