nextjs nestjs oauth2 login 유저 경험을 위한 잔꾀부리기

내가 하고싶은 것

로그인을 하고 나서 내가 보던 페이지로 다시 되돌아가고싶어!

 

만약에 로그인을 하고 /성공으로 리다이렉트 된다고하자.

대부분 유저는 뒤로가기를 누르고 하던걸 계속 할 것이다.

로그인 요청을 보낼때 

nest에서 @Request req:Request를 뜯어서 요청url을 뜯는 법이 있겠다.

하지만 oauth2는 힘들다.

현재 oauth2의 flow는 

사용자가 client_id를 provider oauth api에 제공하면

서버내에서 인가코드뽑고 엑세스토큰받고 provider의 유저정보받는걸 처리한다.(이 방법은 안그래도 유저입장에서 느린 oauth2 프로세스에서 인가코드를 클라이언트에서 뽑아 서버로 전송하는 과정을 숨겨 유저입장에서 더 간단하게 보이게 한다.)

이제 auth callback url로 설정한 api에서 /성공으로 리다이렉트 시킨다.

문제는 @Request req:Request에서 요청 url을 뜯으면 인가코드를 포함한 서버의 api 경로가 나온다. 이럼 안된다. 

따라서 나같은 경우엔 /성공으로 리다이렉트 시키돼, /성공으로 이동시 useEffect를 이용해 이전페이지로 바로 이동시키는 잔꾀를 부렸다.

/성공은 최대한간단하게 만들고 기능도 이전페이지로 이동시키는 것 밖에 없다. 따라서 유저입장에선 로그인 성공시 보고있던 페이지로 이동하는 것이 상당히 빠를 것이다.

 

TODO

oauth2 flow diagram 작성