[google oauth] localhost 에서 400 오류 : redirect_uri_mismatch 오류 해결

문제

- 구성한 endpoint가 잘 동작하는지 테스트해보니 아래처럼 400 오류가 난다. (redirect_uri_mismatch)

 

해결

일단 나는 두가지를 수정 했고, 이후 정상적으로 동작하는 것 확인했다.

1. oauth client id 발급 시, redirect uri 구성을 잘못함

- 승인된 redirection uri에 액세스 토큰 발급 후, 연결할 내 페이지 정보를 넣어주어야 한다.

- 넣은 정보를 endpoint link 구성할 때 redirect_uri 의 value값으로 넣어주어야 한다.

2. redirect_uri 의 value 값을 encode 해서 넣어야 함

 

 

위처럼 변경하고 나면, Link 형태로 만들어서 클릭해도, 콜백 페이지로 잘 이동한다.

 

 

관련 글 : https://reeny404.tistory.com/119, https://reeny404.tistory.com/120

[next/react] google 로그인 구현하기 (1) : oauth client id 발급 받기

[next/react] google 로그인 구현하기 (2) : 액세스 토큰 받기