CKEditor 이미지 업로드에 Spring Security CSRF 토큰 적용하기

Spring Security의 CSRF 방어 기능을 사용하게 되면 CKEditor의 이미지 업로드에도 CSRF 토큰을 보내줘야 됩니다. 이때 전자정부표준프레임웍 템플릿에서 처럼 이미지 업로드를 필터를 통해서 처리하고 있다면 필터의 순서가 중요해집니다.

CKEditor 이미지 업로드를 처리하는 필터가 스프링 시큐리티를 처리하는 필터보다 앞에 나오게 되면 스프링 시큐리티 자체가 적용되지 않습니다. 필터의 순서는 web.xml 파일에 <filter-mapping>이 나오는 순서대로 적용이 됩니다.

1. 필터 순서는 스프링 시큐리티가 앞에 나오게 적습니다.

<!-- security start-->
<filter>
    <filter-name>springSecurityFilterChain</filter-name>
    <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class>
</filter>
<filter-mapping>
    <filter-name>springSecurityFilterChain</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

<listener>
    <listener-class>org.springframework.security.web.session.HttpSessionEventPublisher</listener-class>
</listener>
<!-- security end -->

<!-- 스프링 시큐리티 필터 뒤에 나와야 합니다. -->
<filter>
    <filter-name>CKEditor</filter-name>
    <filter-class>egovframework.com.utl.wed.filter.CkFilter</filter-class>
    <init-param>
        <param-name>properties</param-name>
        <param-value>egovframework/egovProps/ck.properties</param-value>
    </init-param>
</filter>

<filter-mapping>
    <filter-name>CKEditor</filter-name>
    <url-pattern>/ckupload</url-pattern>
</filter-mapping>

2.  CSRF 토큰 적용하기

CKEditor 설정에서 업로드 URL의 지정은 에디터가 설치된곳 아래의 config.js 파일에서 하게 됩니다.

CKEDITOR.editorConfig = function( config ) {
    config.filebrowserUploadUrl = '/ckupload';
};

이 config.js 파일은 에디터를 사용하는 모든 곳에 공통으로 적용이 됩니다. 여기에 URL을 적을때 단점은 컨텍스트 패스를 하드코딩해서 적어야 한다는 것입니다. 컨텍스트 패스가 변경되면 이 설정 파일도 수정을 해야 합니다.

이 설정은 에디터를 사용하는 곳에서 에디터를 생성할때 재정의 할 수 있습니다. CSRF 토큰을 추가하기 위해서 에디터 생성시 URL 을 재정의 해서 토큰을 추가합니다.

<textarea id="nttCn" name="nttCn"></textarea>

<script type="text/javascript">
//<![CDATA[
CKEDITOR.replace('nttCn',
    {filebrowserUploadUrl:'<c:url value="/ckupload" />?${_csrf.parameterName}=${_csrf.token}'}
);
//]]>

재정의할 때는 jsp 파일에서 이루어지므로 스프링 url 태그를 사용해서 컨텍스트 패스가 동적으로 변경될 수 있도록 할 수 있습니다. 또한 URL 뒤에 ?${_csrf.parameterName}=${_csrf.token} 를 사용해서 CSRF 토큰을 추가합니다.

CKEDitor는 이미지 업로드시에 /ckupload?CKEditor=nttCn&CKEditorFuncNum=1&langCode=ko 처럼 자신의 파라미터를 붙이는데,  위에서 처럼 토큰 파마리터를 붙여 두면 /ckupload?_csrf=9deb4a24-2331-4f14-9333-6b8f8f146b37&CKEditor=nttCn&CKEditorFuncNum=1&langCode=ko 과 같이 자동으로 토큰 파라미터 뒤에 &로 파라미터를 붙여서 에러없이 처리가 됩니다.

스프링 시큐리티에서 중복 로그인 방지 및 세션 고정 공격 방지

전자정부표준프레임워크 Spring Security 사용시 로그인한 사용자정보에 추가정보 넣기

Srping Security 권한 직접 체크하기(시큐리티 태그와 인증 클래스)

CKEditor 이미지 업로드에 Spring Security CSRF 토큰 적용하기

전자정부표준프레임워크 Spring Security 설정 간소화에서 CSRF 설정하기

스프링프레임웍 - Spring Security(3) : 사용자/권한 정보 DB사용하기

스프링프레임웍 - Spring Security(2) : 커스텀 로그인 화면 및 권한에 따른 접근 제어

스프링프레임웍 - Spring Security(1) : 기본 설정