set-cookie was blocked 에러

vue+go 로컬 개발시 서버 응답으로 다음과 같이 쿠키 설정 헤더값을 받았다.

set-cookie: jwt=xxxxx; Expires=Wed, 18 Nov 2020 08:12:17 GMT

그런데 쿠키가 설정되지 않는다.

크롬 개발자 도구 cookies 항목을 보면 다음과 같이 secure 부분에 알림 아이콘이 표시되고

마우스 오버하면 tooltip 메시지를 확인 할 수 있다.

This Set-Cookie was blocked because it was not sent over a secure connection and would have overwritten a
cookie with the Secure attribute.

이미 https://localhost 로 jwt 값이 있는게 원인이었다.

쿠키는 도메인에 따라 설정되지만 https 연결로 secure 속성을 가진다.

localhost 라는 도메인으로 jwt 쿠키가 있어 덮어쓰기를 시도하는데,

https 라 secure 하지 않는 http 연결에서의 set-cookie 는 허용되지 않는다.

해결방법1

기존 https://localhost 의 jwt 쿠키를 삭제

해결방법2

다른 쿠키명 사용

"github.com/dgrijalva/jwt-go" 를 사용해 쿠키명은 다르게 해도 된다.

("github.com/go-chi/jwtauth" 는 jwt 라는 쿠키명은 하드코딩되어 있다.)

# 참고

https://github.com/ChromeDevTools/devtools-frontend/blob/4ed2514ff4c70a16159df46e5c1494e3f3fc155e/front_end/sdk/sdk_strings.grdp#L85

https://developer.mozilla.org/ko/docs/Web/HTTP/Headers/Set-Cookie