[섹션8][미니프로젝트-게시판관리] 55~63강(완)

55. 글 작성하기1

로그인한 사용자가 게시글 작성기능 구현하기. 

 

1. 글쓰기 버튼 클릭시 주소창에 인덱스 번호 나타내기

로그인을 하고, 자유게시판을 클릭해보면 주소창에 인덱스번호가 나타난다. 

그런데 글쓰기를 누르면 인덱스번호가 나타나지 않는다. 

어떤 게시글에서 작성한 글인지 알아야 데이터를 저장할 수 있기 때문에, 파라미터로 전달 될수 있도록 세팅하자.

BoardController에서 @RequestParam으로 board_info_idx받아오고, board/main.jsp에 아래와 같이 수정하기

2. write.jsp에 폼 커스텀태그 세팅하기 & BoardController에 writeContentBean주입받기

write.jsp에 modelAttribute 추가하기. 

BoardController에 writeContentBean을 주입받아야 폼태그가 modelAttribute로 받아와 잘 실행되기 때문이다.

3. 유효성 검사 세팅하기

56. 글 작성하기2

파일 업로드 및 게시글 저장기능 구현하기.

파일업로드시 Spring MVC는 CommonsMultipartResolver와 CosMultipartResolver 두가지를 사용하였으나 Servlet 버전3.1부터는 StandardServletMultipartResolver를 사용한다.

 

1. 파일 업로드 전 처리

1. 파일을 서버로 전달받기 위해 write.jsp 에 enctype 한 줄 추가하기

write.jsp에 input태그가 3줄 있다. 제목, 내용은 text를 넣을 수 있는 input태그이며, 첨부이미지는 file을 넣을 수 있는 태그인데, 이대로만 진행하면 파일이 서버로 전달되지 않기 때문에, 맨 윗줄에  enctype="multipart/form-data" 한줄 추가해 준다. 이것은 스프링이 정한 것이 아니고, 웹 표준이 이렇다.

그런데, 이 상태에서 실행하면 글쓰기 시 내용을 입력했는데도 다음단계로 넘어가지 않고 유효성 검사에 걸리게 된다.

잘 넘어가다가 enctype="multipart/form-data" 를 추가하니까 유효성 검사에 걸리는 이유는 

일반적으로 요청을 할 때 데이터를 전달하는 방식이 아닌 다른 방식으로 전달하기 때문에

ContentBean에 자동으로 주입되지 못하는 현상이 발생한다. 

데이터를 뽑아내기 위해서는 어떻게 해야 할까?

Servlet/JSP에서는 이 과정이 복잡한데,   스프링에서는 StandardServletMultipartResolver빈만 정의해주면 된다.

 

2. ServletAppContext에서 StandardServletMultipartResolver빈 정의

                                            & SpringConifgClass 에서 customizeRegistration오버라이딩 

 

MultipartConfigElement를 생성할 때, 4가지 매개변수를 지정해야 한다.

1. 파일을 임시로 저장할 임시파일의 경로 (null값 넣으면 아파치에서 정한 임시폴더로 세팅된다),

2. 업로드할 파일의 최대용량 (50MB),

3. 업로드파일 포함한 모든 정보의 용량 (500MB),

4. 파일의 임계값 (0으로 주게되면 데이터를 알아서 저장하겠다)

3. 첨부한 파일을 받아올 수 있도록 ContentBean에 MultipartFile 객체를 생성하기

브라우저에서 첨부한 파일은 upload_file에 저장하고, content_file은 데이터베이스에 저장된 파일이름을 저장한다.

게터세터메소드도 추가한다.

파일을 받아올 수 있도록 write.jsp에 가서 path를 upload_file로 변경해주기

이 때 실행하면 빈에 잘 주입되어 유효성 검사가 통과된다.

 

2. 업로드 처리

먼저 BoardService생성 & BoardController에 작성하고,

getSize()로 파일크기를 받아서 출력하면 아래처럼 출력된다.

1. option.properties파일에 실제 경로 명시하기

resource에 upload폴더 만들기

파일을 저장할때는 절대경로가 있어야한다. 즉, 서버컴퓨터의 어떤 디렉토리에 저장할건지 그 경로를 명시해야한다.

만약 실제로 프로젝트할때 서버 쪽에서 운영을 한다고 하면 서버의 경로를 그대로 적어주면 되는데 이클립스상에서 테스트할때는 좀 다르다

실제로 실행되는 위치로 잡아줘야 한다.

이클립스상에서 작업하는 위치와 실제로 돌아가는 위치가 분리되어있다.

서비스하고자하는 형태로 변환한뒤 다른위치로 복사해서 거기에서 실행한다. 그 경로를 파악해보자.

 

HomeController에서 "/"만 치고 들어갔을 때 어떤 경로로 실행되는지 아래 코드로 찍어보면 실제 실행 위치가 출력된다.

파일탐색기에 복사해서 넣어주면 실제 실행 경로로 들어간다.

조금 전에 resource 폴더 안에 만든 upload폴더에 실제로 파일이 올라간다.

이 파일의 경로를 option.properties파일 생성 후 path.upload를 넣어준다. 이 때, \를 /로 바꿔준다.

\n \t 를 특수문자로 인식하기 때문이다.

 

2. BoardService에 파일 저장하는 로직 세팅하기

중복파일은 덮어씌우는 것을 방지하기 위해 현재시간_파일이름 으로 세팅

실행 후, 이미지를 저장하면 해당 경로에 업로드한 파일이 잘 들어간 것을 확인할 수 있다.

3. 데이터베이스에 데이터를 저장하기

오라클에서 CONTENT_TABLE을 보면 7개의 컬럼이 있다. 이대로 만들어 주자.

 6번째 줄의 Board_idx의 정보가 아직 없으니,

BoardController의 /write에서 board_info_idx를 @RequestParam으로 받아오고 write.jsp에 <form:hidden>태그 추가

이제 모든 정보가 만들어 졌고, 이제 저장하기.

UserMapper → UserDao → UserService → UserController 순으로 작성

write_success.jsp도 작성하면 끝

실행하고 다음과 같이 글쓰기를 하면 데이터가 잘 저장된 것을 볼 수 있다.

그런데, 이 때 첨부 이미지를 선택 안하고 저장하게 되면 500서버오류가 뜬다.

첨부하지 않으면 content_table에 null값이 들어가는데, 오라클에서 확인해보면 null값을 허용해주는데 왜 에러가 뜰까?

마이바티스 내에서 오류가 나는 것이다. (음 조금 이상하다,,)

해결책은 BoardMapper에서 content_file타입을 jdbcType=VARCHAR로 넣어주면 된다.

57. 글 목록 구현하기

1. 게시판 번호(board_info_idx)에 맞게 게시판 이름을 생성하기

2. 게시글 리스트 가져오기

이 게시판에서 글번호, 제목, 작성자, 작성날짜를 Content_table에서 가져와야 하는데,

작성자는 Content_table에 없어서 User_table과 join해서 가져오도록 한다. 사용자인덱스가 같은사람 찾기.

 

오라클에서 쿼리를 작성한다.

ContentBean클래스에 content_writer_name이 없으니 만들어주기

Mapper → Dao → Service → Controller 순으로 작성

model에 담은 변수를 main.jsp에 담기

실행하면 잘 출력된다.

58. 글 읽는 페이지 구성하기

쓴 글을 클릭하면 내용이 나타나도록 설정, 글을 등록하면 등록한 글이 보이도록 설정하기

1. 게시글 클릭해서 읽기 기능 설정하기

게시글을 클릭하면 url에 경로가 나타내도록 하여, 파라미터를 추출하여 특정 게시글을 보이도록 하기.board/main.jsp 에 경로를 붙여주기.

실행 후, 게시글을 클릭하면 이렇게 경로가 붙는다.

컨트롤러에서 경로를 RequestParam으로 받아온 후, jsp에도 쓰기위해 model에도 주입한다.

Mapper → Dao → Service → Controller 순으로 작성

board/read.jsp 는 그냥 읽기만 하는 용도이기 때문에 굳이 커스텀태그로 바꿔주지 않았다.

실행 후 게시판에 제목을 클릭하면 작성했던 글이 나타난다.

2. 방금 작성한 글 바로 보이도록 설정하기

방금 작성한 글을 보이게 하려면 작성한 글의 인덱스 번호(content_idx) 를 알아야 한다.

Mapper에서 한 줄 추가 & write_success.jsp 에 경로 지정해주기

실행 후, 입력하면 바로 입력한 게시물이 나타난다.

59. 글 수정하기 - 작성 권한 처리

1. 사용자와 작성자가 같을 경우에만 수정,삭제 권한 부여하기

1. 먼저 주소값을 받아와서 수정하기, 삭제하기 버튼에 링크를 달아주기

 

2. 로그인한 사람과 작성자의 index번호가 같은지 확인하기

사용자와 작성자가 같을 경우 수정하기, 삭제하기 보여주도록 if문 설정

실행하면 작성자와 사용자가 같을 경우 수정,삭제버튼이 보이고, 다를경우 보이지 않는다.

2. 직접 주소를 입력하고 요청할 경우를 대비한 인터셉터 처리

1. CheckWriterInterceptor 생성

2. BoardController 추가 & not_writer.jsp 생성

3. ServletAppContext에 인터셉터 추가

수정페이지와 삭제페이지에서 로그인체크확인을 할수 있도록 설정한다.

실행하고 작성자와 다른 사용자로 주소창에 read를 임의로 modify나 delete로 수정하면 튕긴다.

60. 글 수정하기

글 수정하기 버튼을 눌렀을 때 상단에 뜨는 url을 파라미터로 받아오자.

컨트롤러에서 @RequestParam으로 파라미터 받아오고, modify.jsp에서 커스텀태그로 변경

여기까지 하고 실행하면 수정버튼 눌렀을 때 빈 화면으로 뜬다.

작성된 글도 보이게 하자.

이제 수정하기 누르면 작성된 글이 잘 나타난다.

 

수정할 때, 제목과 내용이 빈칸이라면 에러 메시지가 나타나도록 유효성검사처리를 해주자.

이제 업데이트 하는 기능을 만들자.

글과 이미지 모두 수정이 가능해졌다.

61. 글 삭제하기

62. 페이징 구현하기

1. 10개 게시글마다 페이지 넘어가도록 설정

글을 많이 만들어야 하니까 for 문으로 542개 글 생성해주기

RowBounds 추가하기

실행하면 주소창 끝에 page=2 이런식으로 페이지를 직접 지정해주면 페이지가 이동된다.

 

2. 페이지 버튼으로 넘어가도록 구현

페이지번호를 담을 PageBean 클래스 생성

매퍼~컨트롤러 세팅

main.jsp 세팅

63. 나머지 처리하기

1. 게시글 작업 후 해당 페이지로 돌아갈 수 있도록 설정하기

게시글 열람 후, 목록보기를 클릭하면 해당 페이지 번호를 가지고 돌아갈 수 있도록 설정

이제 글 수정후, 수정완료 or 취소를 눌렀을 때 해당 페이지 번호를 가지고 갈 수 있도록 설정

2. 메인화면에서 게시판 4개 세팅하기

MainService클래스 생성하기, MainController작성, main.jsp 작성

 

 

 

출처 : [인프런] 윤재성의 만들면서 배우는 Spring MVC 5