csrf 문제
😭스프링 시큐리티를 사용하게 될 경우 프론트에서 ajax 통신을 할 경우 403 error가 발생합니다.
이를 해결 하기 위해서는 아래와 같은 방법이 있습니다. (타임리프를 사용한다는 가정하에 진행하겠습니다.)
해결 방법
1. csrf 만들어서 보내주기
🧐직접 csrf토큰을 받아서 후에 post요청 시 csrf토큰도 같이 보내주는 방법입니다.
<head>
<meta charset="UTF-8">
<title>교환 반품</title>
<meta name="_csrf" th:content="${_csrf.token}"/>
<meta name="_csrf_header" th:content="${_csrf.headerName}"/>
</head>이렇게 되면 csrf 토큰을 담은 태그가 생성되고 이를 이용하여 post 요청을 보낼시 아래와 같이
fetch(`/where/some`,{
method: "DELETE",
headers: {
'X-CSRF-TOKEN':
document.querySelector('meta[name="_csrf"]').getAttribute('content')
}
})🫠csrf 토큰을 같이 보내주시면 됩니다.(header에 document.querySelector('meta[name="_csrf_header"]').getAttribute('content'))를 넣어주셔도 됩니다.
2. csrf 비활성화
😥csrf를 비활성화 하는 방법입니다. 다만 이 방법은 보안적으로 좋지 않기에 충분히 고려를 하고 사용하셔야 합니다.
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
http.csrf(c -> c.ignoringRequestMatchers("/where/some"));
}위 코드를 사용하게 되면 해당 주소에 대해서는 csrf 검사를 하지 않기에 post 요청을 할 수 있게 됩니다.
😎전역으로 csrf 설정을 끄는 방법도 있습니다.
http.csrf().disable();
greenTea입니다.