window.location.href 오류

카카오 인가 코드를 받기 위한 요청에서 아래와 같이 url이 세팅되는 이슈가 있었다.

이유는 다음과 같았다.

.env 설정

.env에 카카오 endpoint를 저장해두었는데 “따옴표”가 포함되어있었다.

// .env

const NEXT_PUBLIC_KAKAO_ENDPOINT="https://kauth.kakao.com/oauth/authorize"

이렇게 설정해두면 가져오는 과정에서 따옴표가 포함된다.

window.location.href

외부 링크를 열기 위해 window.location.href 함수를 사용하는데 “https://”가 포함되어있지 않으면 기존 도메인이 유지된다.

😱 그래서 문제는!!

따라서 env에서 따옴표가 포함된 주소를 가져왔고 location.href는 https로 인식하지 못해서 기존 도메인 뒤에 새로운 주소를 붙여서 생긴 문제 였던 것이다.