쿠키가 등록안되는 오류

강찬우·2024년 1월 4일

Controller
    @PostMapping("/login")
    public ResponseEntity<TokenDto> authorize(@Valid @RequestBody MemberLoginForm memberLoginForm) {
        LoginServiceV2.AuthAndMakeTokensResponseBody Tokens = loginServiceV2.login(memberLoginForm);
        // tokenDto를 이용해 response body에도 넣어서 리턴
        rq.setCrossDomainCookie("refreshToken", Tokens.getRefreshToken());
        rq.setCrossDomainCookie("accessToken", Tokens.getAccessToken());

        return new ResponseEntity<>(HttpStatus.OK);
    }


Rq.setCrossDomainCookie

    public void setCrossDomainCookie(String name, String value) {
        ResponseCookie cookie = ResponseCookie.from(name, value)
                .path("/")
                .domain("localhost")
                .httpOnly(true)
                .build();

        resp.addHeader("Set-Cookie", cookie.toString());
    }




이런 코드를 작성했는데

분명 응답헤더에는 Set-Cookie가 들어갔는데 이를 웹에서 쿠키로 만들어주지 않았다.

https://velog.io/@haiseong/Set-Cookie%EB%A1%9C-%EB%B8%8C%EB%9D%BC%EC%9A%B0%EC%A0%80%EC%97%90-%EC%BF%A0%ED%82%A4-%EC%A0%80%EC%9E%A5%ED%95%98%EA%B8%B0
이 사이트를 참고해 이를 해결했다.

WebConfig파일에

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**") // 모든 경로에 대해 적용
                .allowedOrigins("http://localhost:5173") // 스벨트킷 서버의 URL
                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                .allowedHeaders("*")
                .allowCredentials(true) // 인증 정보(쿠키) 포함 허용
                .maxAge(3600); // 1시간
    }

이렇게 cors설정을 추가해주었고

const res = await axios.post('http://localhost:8090/api/login', {
    username,
    password,
}, {
    withCredentials: true
});

프런트에서 요청을 보내는 코드에 withCredentials옵션을 넣어 해결하였다.

0개의 댓글