구글 로그인 프론트 화면

안녕하세요 구글 로그인 구현 중 질문있어서 질문드립니다! googleUrl, googleClientId, googleRedirectUrl, googleScope, googleResponseType 을
const auth_url = `${this.googleUrl}?client_id=${this.googleClientId}&redirect_url=${this.googleRedirectUrl}&response_type=code&scope=${this.googlescope}`;
window.location.href = auth_url;
구글로그인 화면을 누르면 리다이렉트 url에 오류가 있다고 하는데 동일한 리다이렉트 url로 해도 잘 안됩니다 이럴 경우 또 어떤 것을 확인해보는게 좋을까요??
답변 2
0
안녕하세요, 인프런 AI 인턴입니다. 최진욱님.
구글 로그인 구현 중 “redirect_uri” 오류를 경험하고 계신 것 같네요. 이 오류는 주로 리다이렉트 URL이 올바르게 설정되지 않았을 때 발생합니다. 다음은 문제를 해결하기 위해 점검할 수 있는 몇 가지 사항들입니다:
리다이렉트 URL 설정 확인:
- Google API Console에서 “OAuth 2.0 클라이언트 ID”의 “승인된 리디렉션 URI”가 정확히 설정되었는지 확인하세요. 설정한 URI가 실제 코드에서 사용하는
redirect_url과 일치해야 합니다. 이는 대소문자를 포함하여 정확히 일치해야 하며, 끝에 슬래시(‘/’)가 있는지 없는지까지도 주의해야 합니다.
- Google API Console에서 “OAuth 2.0 클라이언트 ID”의 “승인된 리디렉션 URI”가 정확히 설정되었는지 확인하세요. 설정한 URI가 실제 코드에서 사용하는
Parameter 이름 확인:
- URL에 사용된 매개변수 이름이 API에 맞게 정확한지 조사해 보세요.
redirect_url이 아니라redirect_uri로 명시되어야 합니다.
- URL에 사용된 매개변수 이름이 API에 맞게 정확한지 조사해 보세요.
URL 인코딩 확인:
- URI에 특정 문자가 포함될 경우 URL 인코딩이 필요할 수 있습니다. 예를 들어, 공백이나 특수 문자가 포함되면
encodeURIComponent를 사용하여 인코딩해주세요.
- URI에 특정 문자가 포함될 경우 URL 인코딩이 필요할 수 있습니다. 예를 들어, 공백이나 특수 문자가 포함되면
브라우저 캐시와 쿠키 제거:
- 경우에 따라 브라우저 캐시 및 쿠키 때문에 이미 설정이 변경되었음에도 불구하고 반영되지 않을 수 있습니다. 캐시와 쿠키를 삭제한 후 다시 시도해 보세요.
- 경우에 따라 브라우저 캐시 및 쿠키 때문에 이미 설정이 변경되었음에도 불구하고 반영되지 않을 수 있습니다. 캐시와 쿠키를 삭제한 후 다시 시도해 보세요.
Google Credentials 확인:
- 사용하고 있는 클라이언트 ID가 정확히 설정되었는지 확인합니다. 이는 Google Cloud Platform에서 프로젝트를 정확히 설정했는지를 뜻합니다.
- 사용하고 있는 클라이언트 ID가 정확히 설정되었는지 확인합니다. 이는 Google Cloud Platform에서 프로젝트를 정확히 설정했는지를 뜻합니다.
이미지와 코드 예제를 참고하여 설정이 일치하는지 꼼꼼히 확인해 보시면 좋겠습니다:

추가적으로, 기존 답변 중 유사한 내용의 질문을 참고하시면 도움이 될 것입니다:
- 인가 코드 전달 및 오류 해결 방법
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
스프링부트 서버 에러나요
0
14
1
74. 데이터 캐시 - 1 (이론) 강의 영상 누락
0
18
1
2026.04에 추가된 강의 시청 불가
0
20
1
Service Create/Update Record 운용과 Delete Record 미운용의 차이 질문
0
13
1
인가 코드 발급(프론트 vs 백)
0
24
2
인텔리제이 MCP 서버 설정 관련
0
22
1
Sequence 관련 질문
1
28
2
Image Only Query
1
29
2
프롬프트, 스킬, sub-agent
0
29
1
도메인 모델에서 관계와 규칙을 구분하는 방법
0
37
2
카카오 클라이언트 시크릿
0
193
2
소셜 로그인 설계
0
96
2
카카오 인가코드 요청
0
104
3
github 주소 어디서 확인가능한가요?
0
159
2
안녕하세요 선생님
1
96
1
application.yml에 동일 OAuth2 제공업체의 redirect-uri를 여러 개 등록할 수 있을지 궁금합니다.
0
133
3
안녕하세요 섹션2. 인가코드(프론트에서 발급) 부분에서 질문 있습니다.
0
106
2
filterchain 구성에서 포스트맨으로 테스트시
0
67
2
프론트엔드에서 Auth.js를 사용했을 때, 질문 있습니다.
0
84
1
[질문] 소셜 로그인한 적이 없다면 회원가입 시키기
0
102
2
토큰 생성강의 코드 실행 문의
0
174
1
refresh 와 naver login 도 두번째 강의도 만들어주시면 어떨까요
0
193
2
백엔드 서버에서 소셜 로그인을 전부 처리하는 것에서 질문 있습니다.
0
223
2
강의 내용 문의 입니당
1
206
1





