inflearn logo
강의

Khóa học

Chia sẻ kiến thức

Đăng nhập SNS Kakao, Google (springboot3, vue3)

구글 로그인 프론트 화면

Đã giải quyết

94

bo3541

19 câu hỏi đã được viết

0

image.png

안녕하세요 구글 로그인 구현 중 질문있어서 질문드립니다! 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;
image.png

 

구글로그인 화면을 누르면 리다이렉트 url에 오류가 있다고 하는데 동일한 리다이렉트 url로 해도 잘 안됩니다 이럴 경우 또 어떤 것을 확인해보는게 좋을까요??

vue.js spring-boot oauth jwt oauth2

Câu trả lời 2

0

bradkim

아래 ai인턴이 말해주는것처럼,

redirect_uri 일단 이 부분이 문제인것 같습니다. 수정후 테스트 해보세요!!

0

bo3541

해결했습니다 감사합니다!

0

communityai8509

안녕하세요, 인프런 AI 인턴입니다. 최진욱님.

구글 로그인 구현 중 “redirect_uri” 오류를 경험하고 계신 것 같네요. 이 오류는 주로 리다이렉트 URL이 올바르게 설정되지 않았을 때 발생합니다. 다음은 문제를 해결하기 위해 점검할 수 있는 몇 가지 사항들입니다:

  1. 리다이렉트 URL 설정 확인:

    • Google API Console에서 “OAuth 2.0 클라이언트 ID”의 “승인된 리디렉션 URI”가 정확히 설정되었는지 확인하세요. 설정한 URI가 실제 코드에서 사용하는 redirect_url과 일치해야 합니다. 이는 대소문자를 포함하여 정확히 일치해야 하며, 끝에 슬래시(‘/’)가 있는지 없는지까지도 주의해야 합니다.
  2. Parameter 이름 확인:

    • URL에 사용된 매개변수 이름이 API에 맞게 정확한지 조사해 보세요. redirect_url이 아니라 redirect_uri로 명시되어야 합니다.
  3. URL 인코딩 확인:

    • URI에 특정 문자가 포함될 경우 URL 인코딩이 필요할 수 있습니다. 예를 들어, 공백이나 특수 문자가 포함되면 encodeURIComponent를 사용하여 인코딩해주세요.
  4. 브라우저 캐시와 쿠키 제거:

    • 경우에 따라 브라우저 캐시 및 쿠키 때문에 이미 설정이 변경되었음에도 불구하고 반영되지 않을 수 있습니다. 캐시와 쿠키를 삭제한 후 다시 시도해 보세요.
  5. Google Credentials 확인:

    • 사용하고 있는 클라이언트 ID가 정확히 설정되었는지 확인합니다. 이는 Google Cloud Platform에서 프로젝트를 정확히 설정했는지를 뜻합니다.

이미지와 코드 예제를 참고하여 설정이 일치하는지 꼼꼼히 확인해 보시면 좋겠습니다:

Google API Console

추가적으로, 기존 답변 중 유사한 내용의 질문을 참고하시면 도움이 될 것입니다:
- 인가 코드 전달 및 오류 해결 방법

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

패키지 구분에 대해 궁금한게 있습니다

0

11

1

스프링부트 서버 에러나요

0

17

1

74. 데이터 캐시 - 1 (이론) 강의 영상 누락

0

29

1

2026.04에 추가된 강의 시청 불가

0

28

1

Service Create/Update Record 운용과 Delete Record 미운용의 차이 질문

0

20

1

인가 코드 발급(프론트 vs 백)

0

28

2

인텔리제이 MCP 서버 설정 관련

0

27

1

Sequence 관련 질문

1

32

2

Image Only Query

1

29

2

프롬프트, 스킬, sub-agent

0

31

1

카카오 클라이언트 시크릿

0

196

2

소셜 로그인 설계

0

96

2

카카오 인가코드 요청

0

105

3

github 주소 어디서 확인가능한가요?

0

159

2

안녕하세요 선생님

1

96

1

application.yml에 동일 OAuth2 제공업체의 redirect-uri를 여러 개 등록할 수 있을지 궁금합니다.

0

133

3

안녕하세요 섹션2. 인가코드(프론트에서 발급) 부분에서 질문 있습니다.

0

107

2

filterchain 구성에서 포스트맨으로 테스트시

0

67

2

프론트엔드에서 Auth.js를 사용했을 때, 질문 있습니다.

0

84

1

[질문] 소셜 로그인한 적이 없다면 회원가입 시키기

0

102

2

토큰 생성강의 코드 실행 문의

0

174

1

refresh 와 naver login 도 두번째 강의도 만들어주시면 어떨까요

0

194

2

백엔드 서버에서 소셜 로그인을 전부 처리하는 것에서 질문 있습니다.

0

223

2

강의 내용 문의 입니당

1

206

1