[Spring] 🔗10)Spring 실습2

게시판 작업을 해보자

테이블 작업을 해준다.

root-context.xml 에서 , 로 property 추가해준다.

vo 생성해주고

 

dao인터페이스 생성 (BoardMapper.java)

Service인터페이스 생성(BoardService.java)

  부모글은 다 단독으로 처리

Service인터페이스 implements할 클래스 생성

  컨테이너에 포함되도록 @Service

  dao(BoardMapper)주입받는다.

Controller 생성(BoardController.java)

  로그 처리

  Service(BoardService)주입받는다

 

VO에 @어노테이션으로 유효성체크를 해준다.

validation에 유효성 메세지 입력한다.

---

게시판 글 목록

Controller에서 타일스 설정

board.xml생성하고 tiles 설정 적용

servelt-context.xml에 board.xml을 등록해준다.

tiles의 body에 명시한 boardList.jsp 생성

 

sevlet-context.xml 에 interceptor(로그인 여부 체크)등록

 

글 등록 폼

Controller에서 자바빈(VO)초기화, 호출

board.xml에서 타일설정

tiles의 body에 명시한 boardWrite.jsp 생성

글 등록 폼에서 전송된 데이터 처리

1.Mapper.java

2.ServiceImpl

3.Controller

게시판 글 목록

특수문자는 <![CDATA[   ]]> 로 감싸준다

startRownum endRownum을 제공해서 페이지 구간을 만든다

서비스

보드컨트롤러

jsp

StringUtil필요함

 

게시판 글 상세

매퍼

서비스

컨트롤러

useBrNoHtml로 html태그 적용안되도록한다.

타일스 설정

boardView.jsp

확장자를 검색하는 태그안 " "시작과 끝에 공백이 있으면 오류가 나서 제대로 실행이 안됀다.

functions 라이브러리르 쓰면 파일이 없을 때, 이미지파일이 아니라 일반 파일 일 때 c:if 조건문에서 false로 인식이 되고

그렇기 때문에 이미지 처리가 되지않게 된다,

 

 

 

DownloadView.java 기존에 쓰던 파일 형식을

바이트 배열 형식으로 코드 수정, 추가 (파일명처리, 스트림처리))

 

sevelt-context.xml

controller

글 수정폼

컨트롤러

데피니션설정 파일설정 보드.xml

boardModify.jsp

  

삭제

보드 매퍼

  하나의 레코드를 삭제하는 것이아니라 그안의 파일 정보를 비워버려야한다,.

보드서비스

에ㅣ젝스컨트롤러

  에이젝스방식을 사용하므로 

  이것을 jsp에 명시하여 통신하게한다.

 

수정폼에 전송된 데이터 처리

보드매퍼

  파일이 있는 경우 없는경우 조건체크를 위해 xml에 명시

보드서비스

컨트롤러

  

 

로그인 회원번호와 작성자 회원번호가 일치하는지 여부체크

WriterCheckInterceptor.java

servlet-context.xml에 등록

 

CKEditor이용하기

https://ckeditor.com/

WYSIWYG HTML Editor with Collaborative Rich Text Editing

ckeditor.zip

1.17MB

CKEditor에서 이미지 링크한 정보들이 여기에 생성되도록 폴더생성한다.

4개의 파일을 js경로에 넣어준다.

html태그에서 js파일넣고 스크립트 하나만 넣어주면 처리가 됐는데

CKEditor는  부트스트랩을 링크시킨다.

이미지 업로드 부분이 있기 떄문에 그 부분은 구현을 해준다.

하나의 경로로 공유해서 사용이 가능하다.

 

CKEditor - 사진업로드하기

 

main에 Controller를 만든다

모든 프로젝트에서 공유해서 사용하는 메서드를 여기(CommonController.java)에 넣는다.

그리고 uploadAdapter.js 파일과 통신을 한다.

 

여기서 호출할 수 있게 코드가 들어있어서 통신한다

절대경로를 보게되면 업로드한 이미지들이 들어가있다.

boardWrite.jsp

CDN방식으로 라이브러리 링크시켜준다.

<!-- bootstrap 라이브러리 -->

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" >

<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js" ></script>

<script type="text/javascript" src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" ></script>

<style>
.ck-editor__editable_inline{ /*CKEditor 내부에서 사용되는 스타일을 지정한다. 언더바(_) 2개 주의 */
min-height: 250px;
}
</style>

<!-- CKEditor 라이브러리 -->

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/ckeditor.js" ></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/uploadAdapter.js" ></script>

 

스크립트 파일을 복사해서 내용쪽 라인에 넣는다.

 

CKEditor - 영상업로드하기

boardView.jsp

순수 자바스크립트로만 이뤄지지않았다면 제이쿼리 링크를 가져온다.

<!-- CKEditor 라이브러리 -->

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/board.reply.js" ></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/videoAdapter.js" ></script>

 

유튜브 링크를 넣어서 사용이 가능하다.

댓글기능

sql 작업해준다

VO작업

CSS작업

로딩 이미지 gif파일 넣어주고

DurationFromNow.java를 util패키지에 넣어준다.

 

boardView.jsp

기본적인 폼 작성하고 

제이쿼리 라이브러리를 넣어준다.

<script src="${pageContext.request.contextPath}/resources/js/jquery-3.6.0.min.js"></script>

외부 js파일 사용할 것이므로 

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/board.reply.js"></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/videoAdapter.js"></script>

 

board.reply.js

작성. 해설은 저번 댓글작성 참고한다.

댓글등록

BoardMapper.java

BoardServiceImpl.java

BoardAjaxController.java

 

board.reply.js

1. 댓글 작성 폼 초기화

목록작업 전이라 db에 등록되는지 확인한다.

 

댓글 목록

BoardMapper.java/BoardMapper.xml

selectListReply

selectRowCountReply

 

BoardAjaxController.java

 

board.reply.js

 

댓글 수정

수정폼

board.reply.js

수정

BoardMapper.java

updateReply

selectReply 작성자와 로그인회언이일치하는지 확인하기 위함

BoardServiceImpl.java

 

BoardAjaxController.java

 

board.reply.js

 

댓글 삭제

BoardMapper.java

deleteReply

deleteReplyByBoardNum(부모글 삭제시 댓글이 존재하면 부모글 삭제 전 댓글 삭제한다)

BoardServiceImpl.java

 

BoardAjaxController.java

 

board.reply.js