ckeditor4
- 작성자 :
- 정*호
- 작성일 :
- 2018-08-06 17:53:21
- 조회수 :
- 2,203
- 구분 :
- 공통컴포넌트
- 진행상태 :
- 완료
Q
jsp페이지에서 ckeditor의 파일업로드 기능을 수행하기 위해
< 해당jsp (글쓰는 jsp) >
var ckeditor_config = {
filebrowserUploadUrl: '${pageContext.request.contextPath}/utl/wed/insertImage.do', // 파일 업로드를 처리 할 경로 설정.
};
CKEDITOR.replace('nttCn',ckeditor_config);
을 추가하였습니다.
<config.js>
CKEDITOR.editorConfig = function( config ) {
config.filebrowserUploadUrl = '${pageContext.request.contextPath}/utl/wed/insertImage.do';
};
이렇게 수정하였습니다.
이 코드 이외에는 아무 코드도 없습니다. config.js에는 딱 저 코드만 있습니다.
<EgovInsertImage.jsp>
이 곳에
window.parent.CKEDITOR.tools.callFunction('${ckEditorFuncNum}', '${url}', '파일 전송 완료.');
를 추가하였습니다.
이렇게만 수정,추가하면 된다고 하셨는데
이렇게 하면
HTTP Status 404 -
type Status report
message
description The requested resource is not available.
Apache Tomcat/7.0.88
404오류가 뜨는데 왜 그런건가요?
드래그 앤 드랍하면 저렇게 뜨기도 하네요
마찬가지로 404오류
< 해당jsp (글쓰는 jsp) >
var ckeditor_config = {
filebrowserUploadUrl: '${pageContext.request.contextPath}/utl/wed/insertImage.do', // 파일 업로드를 처리 할 경로 설정.
};
CKEDITOR.replace('nttCn',ckeditor_config);
을 추가하였습니다.
<config.js>
CKEDITOR.editorConfig = function( config ) {
config.filebrowserUploadUrl = '${pageContext.request.contextPath}/utl/wed/insertImage.do';
};
이렇게 수정하였습니다.
이 코드 이외에는 아무 코드도 없습니다. config.js에는 딱 저 코드만 있습니다.
<EgovInsertImage.jsp>
이 곳에
window.parent.CKEDITOR.tools.callFunction('${ckEditorFuncNum}', '${url}', '파일 전송 완료.');
를 추가하였습니다.
이렇게만 수정,추가하면 된다고 하셨는데
이렇게 하면
HTTP Status 404 -
type Status report
message
description The requested resource is not available.
Apache Tomcat/7.0.88
404오류가 뜨는데 왜 그런건가요?
드래그 앤 드랍하면 저렇게 뜨기도 하네요
마찬가지로 404오류
A
안녕하세요.
표준프레임워크센터입니다.
CK Editor 설정에서
업로드 URL로
/utl/wed/insertImage.do를 지정 한것입니다.
해당 URL이 업로드 요청을 받도록 기능을 구현하셔야 합니다.
공통컴포넌트 3.5버전을 보시면
해당 URL및 코드를 참고 하실수 있으며
CK Editor 4 버전에 맞게 약간 수정이 필요합니다.
@RequestMapping(value="/utl/wed/insertImage.do", method=RequestMethod.POST)
public String imageUpload(@RequestParam(value="CKEditorFuncNum", required=false) String ckEditorFuncNum ~~~~~~~
model.addAttribute("ckEditorFuncNum", ckEditorFuncNum);
~~~~~~~~~ 생략 (업로드 기능 구현) ~~~~~~~
return "egovframework/com/utl/wed/EgovUploadImageComplete";
}
위처럼 구현하시면 됩니다.
감사합니다.
표준프레임워크센터입니다.
CK Editor 설정에서
업로드 URL로
/utl/wed/insertImage.do를 지정 한것입니다.
해당 URL이 업로드 요청을 받도록 기능을 구현하셔야 합니다.
공통컴포넌트 3.5버전을 보시면
해당 URL및 코드를 참고 하실수 있으며
CK Editor 4 버전에 맞게 약간 수정이 필요합니다.
@RequestMapping(value="/utl/wed/insertImage.do", method=RequestMethod.POST)
public String imageUpload(@RequestParam(value="CKEditorFuncNum", required=false) String ckEditorFuncNum ~~~~~~~
model.addAttribute("ckEditorFuncNum", ckEditorFuncNum);
~~~~~~~~~ 생략 (업로드 기능 구현) ~~~~~~~
return "egovframework/com/utl/wed/EgovUploadImageComplete";
}
위처럼 구현하시면 됩니다.
감사합니다.