Replies: 3 comments
-
|
simple request, prefilght request |
Beta Was this translation helpful? Give feedback.
-
한 도메인 또는 웹 페이지가 다른 도메인을 가진 리소스에 엑세스할 수 있게 하는 보안 메커니즘
동일한 출처의 리소스에만 접근하도록 제한하는 것 왜 동일한 출처에서만 접근하도록 허용하는가?
지금은 클라이언트에서 도메인이 다른 서버에서 제공하는 API를 사용하는 일이 많아졌다.
동일 출처 정책은 브라우저에서 임의로 하는 것 브라우저는 다른 출처로 요청을 보낼 때 다음과 같은 절차를 거침 Simple requestsimple 요청은 pre-flighted 요청을 보내지 않는다. 아래의 3가지 조건을 모두 만족하면, simple request
simple request 과정
Preflighted requestpreflighted 요청은 simple request와는 다른 유형의 CORS 요청이다. 브라우저에서 진짜 요청을 보내기 전에 미리 확인 요청을 보낸다. 이 요청은 OPTIONS 메소드를 사용한다. preflighted 요청은 다음과 같은 과정을 거친다.
클라이언트(프론트)에서 해결
서버(백엔드)에서 해결하기 (우리가 알아야하는 부분)스프링 CORS
기본적으로 @crossorigin은 모든 출처, 모든 헤더, @RequestMapping 주석에 지정된 Http 메소드에 최대 30분을 허용한다. 어노테이션에 속성 값을 넣어 기본 값을 대체할 수 있다. 속성값으로는 다음이 있다.
EX ) @CrossOrigin(origin="*", allowedHeaders = "*")
@Controller
public class MainController {
@GetMapping(path = "/")
public String main(Model model) {
return "main";
}
}
@Component
public class SimpleCorsFilter implements Filter {
@Override
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
HttpServletRequest request = (HttpServletRequest) req;
HttpServletResponse response = (HttpServletResponse) res;
response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT, PATCH");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With, remember-me");
chain.doFilter(req, res);
}
@Override
public void init(FilterConfig filterConfig) {
}
@Override
public void destroy() {
}
} |
Beta Was this translation helpful? Give feedback.
-
|
브라우저는 보안 상의 이유로 SOP(Same-Origin Policy, 동일 출처 정책) 에 따라 다른 출처(Cross-Origin)에 있는 서버로 요청하는 것을 차단합니다.
그러나 웹 환경 특성상 다른 출처에 있는 리소스를 요청하는 일이 흔하게 발생합니다. 그래서 SOP에 대한 예외 조항을 두고, 이 조항에 해당하는 요청은 출처가 다르더라도 허용하는 CORS(Cross-Origin Resource Sharing) 정책이 등장합니다. CORS 동작 원리
Preflight Request브라우저는 요청을 보낼 때 한 번에 보내지 않고 먼저 예비 요청을 보낸 후 본 요청을 전송합니다.
Simple Request예비 요청을 생략하고
보통 Content-Type으로 application/json을 많이 사용하기 때문에 Simple Request는 드물게 발생합니다. Credentialed Request기본적으로 브라우저가 제공하는 요청 API(XMLHttpRequest, fetch API)는 별도의 옵션 없이 브라우저의 쿠키 정보나 인증과 관련된 헤더를 함부로 요청에 담지 않습니다. |
Beta Was this translation helpful? Give feedback.
-
.
Beta Was this translation helpful? Give feedback.
All reactions