클라이언트와 연결(React)

React부분은 클라이언트 파트 담당자들이 진행하기 때문에 레포지토리 링크만 걸어두고 별도의 설명은 생략하겠습니다.
https://github.com/UOS-Capstone/FrontEnd

Spring Boot 코드 수정

클라이언트 주소에서 요청이 왔을 때 이를 수용할 수 있도록 연결을 해주어야합니다.

WebConfig

package uos.capstone.dms;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost:3000")
                .allowedMethods("GET", "POST")
                .allowCredentials(true);
    }
}

단, localhost로 현재 연결이 되어있으므로 VPN으로 연결하거나, 하나의 컴퓨터에서 실행해야 합니다.

간단한 세팅을 통해 3000번 포트에서 오는 GET, POST 요청에 대해 모든 URL이 매핑되어 접근할 수 있습니다.

• allowCredentials를 true로 설정해야 CORS에러를 방지할 수 있습니다.

또한, 크롬 브라우저에서는 제 3자가 설정하는 Cookie를 허용하지 않습니다. 이를 허용하기 위해서 Controller를 수정합니다.

MemberController

    @Operation(summary = "로그인")
    @PostMapping("/login")
    public ResponseEntity<String> memberLogin(@RequestBody LoginRequestDTO loginRequestDTO) {
        TokenDTO tokenDTO = memberService.login(loginRequestDTO);
        ResponseCookie responseCookie = ResponseCookie
                .from("refresh_token", tokenDTO.getRefreshToken())
                .httpOnly(true)
                .secure(true)
                .sameSite("None")     //추가
                .maxAge(tokenDTO.getDuration())
                .path("/")
                .build();

        return ResponseEntity.ok().header("Set-Cookie", responseCookie.toString()).body(tokenDTO.getAccessToken());
    }

• sameSite를 None으로 설정해주어야 다른 Origin에 대해서 쿠키를 생성할 수 있습니다.

Github 커밋 코드

https://github.com/UOS-Capstone/DMS_Server/commit/f11e70aca4c84518938d6ef21e099d7f616b38a7

참고자료
https://dev-pengun.tistory.com/entry/Spring-Boot-CORS-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0
https://velog.io/@pjh612/JWTCORS-%EC%9D%B4%EC%8A%88-%EC%83%81%ED%99%A9%EC%97%90%EC%84%9C-%EC%BF%A0%ED%82%A4%EC%A0%84%EB%8B%AC