vercel ec2 도메인 서브도메인 호스팅 (트러블 슈팅)

트러블

칵테일 프로젝트를 진행하면서 로컬에서는 쿠키를 서로 잘 주고받았는데 호스팅을하고나니

서버에서 보낸쿠키를 vercel호스팅한 페이지에서 받을수없는 문제가 발생했다.

쿠키는 로그인에 필요해서 필수적으로 해결이 되어야한다. 

 

원인

찾아보니 서로 다른 도메인끼리는 쿠키교환이 안된다고한다.

그래서 필요한게 서브도메인이라는 개념인데

naver.com 이 도메인이라면

blog.naver.com 은 서브도메인이되는개념으로

이런 도메인구조에서는 서로 같은 도메인으로 인식되고 실제로 하나의 도메인만 사용하기때문에

도메인도 하나만있어도되고 쿠키교환도 가능하다는 점을 알게되었다.

 

www.soolae-server.shop 에 vercel 이연결되어서 서브도메인에 vercel을 연결해주었다.

Sool lae

 

Vercel에 도메인 연결하기

 

vercel 에 호스팅한 프로젝트로 들어가서 settings - Domains 에들어가준다.

돋보기가 있는부분에 연결할 도메인을 입력하고 Add를 눌러준다.
아마 정상적으로 호스팅되는 도메인을 입력하면 선택하는게 3개나올텐데

제일 아래쪽에 있는걸 선택하면 현재입력한 도메인만 생성해준다.

제일아래 Add 도메인 을 선택하고 Add

나는 www.soolae-server.shop 만 이용할 계획이므로 제일 아래를 선택한다 다른 옵션들은 서브 도메인에서 도메인으로 리다이렉트시키거나 도메인에서 서브도메인으로 리다이렉트 시켜주는 옵션인것같다. 

 

도메인을 추가해주고나면 빨간색으로 Invalid Configuration이라고 뜰텐데

Value에 나와있는 ipv4 주소를 Route53에 추가해놓은 도메인으로가서 레코드추가해주면 끝이다. 

 

Route53의 호스팅영역 생성방법은 이 포스팅을 참고

(트러블 슈팅) - https 요청에러

 

레코드 이름에 서브도메인이랑 똑같이 www 를 붙여주고 레코드 유형은 A 

값에는 복사한 Value인 ipv4 주소를 넣어주고 레코드를 생성해주면 Route53에서 해줘야하는일은 끝난다.

 

이제 다시 vercel로 돌아와서 확인해보면 

이렇게 나오면 도메인이 잘 등록된것이다. 

 

서브도메인에 클라이언트부분을 호스팅하면서 본래 도메인에 호스팅해놓은 api를 다시 옮기지않아도 되고 인증서도 그대로 쓸수있게되어서 예상했던것보다 시간을 많이 단축할수있었다.

도메인이 같아지면서 서버에서 쿠키를 만드는 코드도 수정해주었다.

Java

ResponseCookie cookie = ResponseCookie.from("Authorization",token)
        .path("/")
        .maxAge(60*60*1000)
        .secure(true)
        .domain(".soolae-server.shop")
        .sameSite("None")
        .build();
response.addHeader("Set-Cookie", cookie.toString());

이렇게 코드를 수정하면서 호스팅해놓은 페이지에서도 로그인시에 쿠키를 잘받아올수있게되었다. 

 

그러나 추가적인 문제가 발생했는데. 이제는 쿠키가 지워지지않는다..

 

쿠키가 안지워지는경우(트러블 슈팅)

 

이렇게 해결해 주었다. 

 

이제 로그인도 잘되고 큰 에러없이 프로젝트가 잘돌아가는것같다.