본문 바로가기
▾ Back-End/▸ Java

CKEditer, CKFinder 사용하기

띵한척 2013. 8. 23. 17:57
□ 개발환경

Eclipse : 3.4.2 

FrameWork : eGovFramework 1.1.1

Java : 1.7

Was : Tomcat 6

CKEditer : 3.6.6.1

CKFinder : 2.4


1. www.ckeditor.com/ 접속 후 CKEditer와 CKFinder를 다운로드


2. 다운받은 CKEditer를 아래 이미지와 같은 경로에 복사

 

3. JSP에 CKEdtier 적용

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">

<title>Insert title here</title>

<script type="text/javascript" src="ck/ckeditor/ckeditor.js" ></script>

</head>

<body>

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

<script type="text/javascript">

CKEDITOR.replace( 'ckEditor' );

</script>

</body>

</html>


4. 결과


5. 다운받은 CKFinder의 war파일을 압축해제 후 ckfinder폴더를 아래 이미지와 같은 경로에 복사

 



6. 다운받은 CKFinder의 war파일을 압축해제 후 WEB-INF > lib 하위 jar파일을 추가

 


7. /javayo.editerTest/src/main/webapp/WEB-INF/web.xml 파일에 아래내용 ckFinder 내용 추가

<!-- ckFinder -->

<servlet>

<servlet-name>ConnectorServlet</servlet-name>

<servlet-class>com.ckfinder.connector.ConnectorServlet</servlet-class>

<init-param>

<param-name>XMLConfig</param-name>

<param-value>/WEB-INF/ckEdit_config.xml</param-value>

</init-param>

<init-param>

<param-name>debug</param-name>

<param-value>false</param-value>

</init-param>

<load-on-startup>1</load-on-startup>

</servlet>

<servlet-mapping>

<servlet-name>ConnectorServlet</servlet-name>

<url-pattern>

/ck/ckfinder/core/connector/java/connector.java

</url-pattern>

</servlet-mapping>

<filter>

<filter-name>FileUploadFilter</filter-name>

<filter-class>com.ckfinder.connector.FileUploadFilter</filter-class>

                <init-param>

                    <param-name>sessionCookieName</param-name>

                    <param-value>JSESSIONID</param-value>

                </init-param>

                <init-param>

                    <param-name>sessionParameterName</param-name>

                    <param-value>jsessionid</param-value>

                </init-param>

</filter>

<filter-mapping>

<filter-name>FileUploadFilter</filter-name>

<url-pattern>

/ck/ckfinder/core/connector/java/connector.java

      </url-pattern>

</filter-mapping>


8. /javayo.editerTest/src/main/webapp/WEB-INF/ckEdit_config.xml 파일추가

<config>

<enabled>true</enabled>

         <!-- 실제로 저장할 디렉토리(자신의 하드디스크 경로) -->

<baseDir>C:/egovframework/workspace/editerTest/src/main/webapp/ckeditorUpload</baseDir>

        <!-- 프로젝트 내에 저장할 폴더 -->

<baseURL>/editerTest/ckeditorUpload/</baseURL>

<licenseKey></licenseKey>

<licenseName></licenseName>

<imgWidth>1600</imgWidth>

<imgHeight>1200</imgHeight>

<imgQuality>80</imgQuality>

<uriEncoding>UTF-8</uriEncoding>

<defaultResourceTypes></defaultResourceTypes>

<types>

<type name="Files">

<url>%BASE_URL%files/</url>

<directory>%BASE_DIR%files</directory>

<maxSize>0</maxSize>

<allowedExtensions>7z,aiff,asf,avi,bmp,csv,doc,docx,fla,flv,gif,gz,gzip,jpeg

                        jpg,mid,mov,mp3,mp4,mpc,mpeg,mpg,ods,odt,pdf,png,ppt,pptx,pxd,qt,ram,rar

                        ,rm,rmi,rmvb,rtf,sdc,sitd,swf,sxc,sxw,tar,tgz,tif,tiff,txt,vsd,wav,wma,wmv,xls,xlsx,zip

</allowedExtensions>

<deniedExtensions></deniedExtensions>

</type>

<type name="Images">

<url>%BASE_URL%images/</url>

<directory>%BASE_DIR%images</directory>

<maxSize>0</maxSize>

<allowedExtensions>bmp,gif,jpeg,jpg,png</allowedExtensions>

<deniedExtensions></deniedExtensions>

</type>

<type name="Flash">

<url>%BASE_URL%flash/</url>

<directory>%BASE_DIR%flash</directory>

<maxSize>0</maxSize>

<allowedExtensions>swf,flv</allowedExtensions>

<deniedExtensions></deniedExtensions>

</type>

</types>

<userRoleSessionVar>CKFinder_UserRole</userRoleSessionVar>

<accessControls>

<accessControl>

<role>*</role>

<resourceType>*</resourceType>

<folder>/</folder>

<folderView>true</folderView>

<folderCreate>true</folderCreate>

<folderRename>true</folderRename>

<folderDelete>true</folderDelete>

<fileView>true</fileView>

<fileUpload>true</fileUpload>

<fileRename>true</fileRename>

<fileDelete>true</fileDelete>

</accessControl>

</accessControls>

<thumbs>

<enabled>true</enabled>

<url>%BASE_URL%_thumbs/</url>

<directory>%BASE_DIR%_thumbs</directory>

<directAccess>false</directAccess>

<maxHeight>100</maxHeight>

<maxWidth>100</maxWidth>

<quality>80</quality>

</thumbs>

<disallowUnsafeCharacters>false</disallowUnsafeCharacters>

<checkDoubleExtension>true</checkDoubleExtension>

<checkSizeAfterScaling>true</checkSizeAfterScaling>

<secureImageUploads>true</secureImageUploads>

<htmlExtensions>html,htm,xml,js</htmlExtensions>

<forceASCII>false</forceASCII>

<hideFolders>

<folder>.*</folder>

<folder>CVS</folder>

</hideFolders>

<hideFiles>

<file>.*</file>

</hideFiles>

<plugins>

<plugin>

<name>imageresize</name>

<class>com.ckfinder.connector.plugins.ImageResize</class>

<params>

<param name="smallThumb" value="90x90"></param>

<param name="mediumThumb" value="120x120"></param>

<param name="largeThumb" value="180x180"></param>

</params>

</plugin>

<plugin>

<name>fileeditor</name>

<class>com.ckfinder.connector.plugins.FileEditor</class>

<params></params>

</plugin>

</plugins>

<basePathBuilderImpl>

            com.ckfinder.connector.configuration.ConfigurationPathBuilder

        </basePathBuilderImpl>

</config>


















저작자표시 비영리 변경금지

'▾ Back-End > ▸ Java' 카테고리의 다른 글

전자정부프레임웍 쿼리 로그 설정  (0) 2013.10.15
CKEditor full version IE버젼에서 안보이는 현상 해결 방법  (0) 2013.08.22

'▾ Back-End/▸ Java' Related Articles

티스토리툴바