Server

[Web, Tomcat Server] ..in a frame because it set x-frame-options to sameorigin

dev.yong 2018. 3. 24. 12:24

iframe으로 youtube동영상을 호출하여 재생하는 작업을 하다가 동영상이 재생되지 않아 크롬 개발자 도구로 확인해 봤다니 다음과 같은 메세지를 출력하고 있었다.


 "....in a frame because it set x-frame-options to sameorigin"


X-Frame-Option header

X-Frame-Option header는 FrameSet이나 iframe등에 의한 클릭재킹에 대한 보호를 제공하고 2009susdp IE8에 추가되었고 얼마 후 다른 브라우져들에도 채택되었다.

이 헤더의 값은 DENY, SAMEORIGIN, ALLOW-FROM 중 하나를 가지며 각각 외부 사이트에 대한 프레임 금지, 같은 사이트만 허용, 특정 사이트만 허용의 의미를 가진다.


- X-Frame-Option header의 옵션들

DENY

 외부 사이트에 대한 프레임 금지

 SAMEORIGIN

 같은 사이트만 허용

 ALLOW

 특정 사이트만 허용



그렇다면 클릭재킹은 무엇인가?
클릭재킹(Clickjacking)이란

마우스 클릭(Click)과 항공기 불법탈취 또는 납치를 의미하는 하이재킹(hijacking)의 합성어로, 사용자는 어떤 웹 페이지를 클릭하지만 실제로는 다른 어떤 페이지의 컨텐츠를 클릭하게 되는 것이다. 대표적인 방법으로는 정상적인 버튼 밑에 해킹 기능을 넣은 보이지 않는 버튼을 배치하는 것이다. 

(http://blog.ahnlab.com/ahnlab/426 참조) 



X-Frame-Option header는 다양한 루트로 설정할 수 있다.

1) 웹서버에서 설정
Apache
Header always append X-Frame-Options SAMEORIGIN
Nginx
add_header X-Frame-Options SAMEORIGIN;

2) Tomcat에서 설정
톰캣은 X-Frame-Option옵션의 디폴트값이 DENY이다.
헤더를 설정하기 위해 다음과 같은 방법을 사용할 수 있다.


방법 1) Servlet Filter를 추가하는 방법

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
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() {
 
 
    }
}
cs




방법 2) HttpHeaderSecurityFilter 사용하는 방법(HttpHeaderSecurityFilter는 Tomcat 7.0.77 부터 사용 가능)
1
2
3
4
5
6
7
8
9
10
11
12
13
<filter>
    <filter-name>httpHeaderSecurity</filter-name>
    <filter-class>org.apache.catalina.filters.HttpHeaderSecurityFilter</filter-class>
    <init-param>
        <param-name>antiClickJackingOption</param-name>
        <param-value>SAMEORIGIN</param-value>
    </init-param>
</filter>
 
<filter-mapping>
    <filter-name>httpHeaderSecurity</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>
cs