<iframe src="http://www.naver.com"></iframe>
네이버를 아이프레임에 넣으면 빈 화면만 표시된다.
굳이 이런것까지 막을 필요가 있을까 싶겠지만, 간단하게 자바스크립트로 작성한 프레임(주로 iframe)을 이용한 디도스 공격을 시도한다면 그대로 당할 수 밖에 없다.
이러한 사소한 공격이라도 예방하려면 사이트가 프레임 또는 아이프레임에 표시되지 않도록 해야 한다.
또한 이 방법은 클릭재킹공격(Clickjacking Attact)에 대한 예방효과도 있다.
자바스크립트를 이용한 방법
<script type="text/javascript">
if(top != window) {
top.location = window.location;
}
</script>
메타 태그를 이용한 방법
<meta http-equiv="X-Frame-Options" content="deny" />
서버사이드 확장헤더를 이용한 방법
PHP
header("X-Frame-Options: DENY");
Java
HttpServletResponse res = (HttpServletResponse)response;
res.addHeader("X-FRAME-OPTIONS", "DENY");
C#
this.Response.Headers["X-FRAME-OPTIONS"] = "DENY";
또는
HttpContext.Current.Response.AddHeader("x-frame-options", "DENY");
X-Frame-Options 확장헤더에 사용되는 값
DENY : 해당 페이지를 frame에 표시할 수 없게 한다
SAMEORIGIN : 해당 페이지와 동일한 orgin에 해당하는 frame만 표시 한다
ALLOW-FROM uri : 해당 페이지는 지정된 orgin에 해당하는 frame만 표시 한다
Http Server를 이용한 방법
Apache
- Header always append X-Frame-Options SAMEORIGIN
Nginx
- add_header X-Frame-Options SAMEORIGIN;
위와 같이 설정하면 된다. 나 또한 위 설정을 통해 X-Frame-Options 설정을 변경했다. 그런데 문제가 해결되는 것이 아니라 또 다른 문제가 생겼다.
Multiple 'X-Frame-Options' headers with conflicting values ('SAMEORIGIN, DENY')
http 응답 헤더를 분석했더니 DENY와 더불어 또 하나의 SAMEORIGIN 설정이 추가되어 충돌이 발생하는 상황이었다. 아무리 DENY 설정을 제거하려고 삽질을 해봤지만 제거되지 않았다.
1시간 동안 Apache 웹 서버와 삽질하다가 혹시 Apache가 아니라 뒤에 연결되어 있는 Tomcat 서버의 응답 헤더에 DENY 설정이 포함되어 있는 것은 아닐까라는 의심을 하게 되었다.
> curl -I http://localhost:8080
위와 같이 명령을 실행해 응답 헤더를 확인하니 떡하니 DENY 설정이 추가되어 있다. 이럴 때의 허무함이란..
다시 Tomcat에서 X-Frame-Options 설정 시작했다. Tomcat은 기본 값으로 X-Frame-Options 설정을 DENY로 설정하고 있었다. 이 문제를 해결하기 위해 Servlet Filter를 추가해 해결했다.
public class CorsFilter implements Filter {
@Override
public void init(FilterConfig filterConfig) throws ServletException {
}
@Override
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
HttpServletResponse response = (HttpServletResponse) servletResponse;
response.setHeader("X-Frame-Options", "ALLOW-FROM https://apps.facebook.com");
filterChain.doFilter(servletRequest, servletResponse);
}
@Override
public void destroy() {
}
}
위와 같이 설정하니 X-Frame-Options가 정상적으로 변경되는 것을 확인했다. chrome은 아직까지 ALLOW-FROM 설정을 인식하지 못해 무시해 버리기 때문에 정상적으로 동작한다. 다룬 브라우저도 정상적으로 동작... 오늘 오전의 삽질 경험을 공유해 본다.
spring security 버전 업그레이드 후에 X-Frame-Options이 http header에 추가되어 iframe으로 동작하던 기능이 정상적으로 동작하지 않는 이슈가 발생했다.
얼마 전 X-Frame-Options to DENY 설정 때문에 iframe을 통해 접근할 수 없는 문제 해결 글에서도 관련 이슈를 등록했던 적이 있다. 이 문제를 해결하면서 이전에 추가하지 않던 header를 tomcat에서 갑자기 추가하지는 않을 것으로 예상했다. 그냥 의구심만 가지고 지나쳤다가 다른 iframe 이슈를 해결하다 X-Frame-Options header를 spring security가 보안 이슈를 해결하기 위해 추가한다는 것을 알게 되었다.
가능하면 iframe을 사용하지 않으면 좋겠지만 그렇지 않은 경우 다음과 같이 X-Frame-Options header 추가하는 부분을 다음과 같이 disable 함으로써 문제를 해결할 수 있다.
http.headers().frameOptions().disable()
PS.. Apple Safari 11 에서는 iFrame에서 실행되는 콘텐츠에 대해 IndexedDB를 지원하지 않습니다.
(TypeError: 'undefined' is not an object (evaluating 'window.indexedDB.open')
