SlideShare a Scribd company logo
1 of 12
Portfolio 개인 프로젝트
신입 웹 개발자 장현수
Interceptor 로그인과 Spring 게시판
INDEX
1. 개발환경
2. Interceptor를 이용한 로그인
3. 로그인 후 경로문제
4. Spring 게시판
개발환경
개발 툴 : STS(Spring Tool Suite)
운영체제 : Windows7
서버 : Apache tomcat 8.0
DB : MySQL
사용한 언어 : JAVA(spring, mybatis), JSP, JavaScript, HTML/CSS
오픈소스 : Bootstrap, Jquery, Ajax
Interceptor를 이용한 로그인
인터셉터는 preHandle과 postHandle을 이용하여 사용자의 HttpSession 처리를 담당하는
LoginInterceptor와 특정 경로에서의 사용자 로그인 상태를 체크하는 AuthInterceptor를 만들었습니다.
preHandle()을 이용하여 현재 사용자가 로그인한 상태인지를
체크하고, 컨트롤러를 호출할 것인지를 결정합니다. 만약 로그
인 하지 않은 상태라면 컨트롤러에서 설정한 위치인
/member/login으로 이동합니다.
Servlet-context에 인터셉터 설정정보를 등록하여 로그인 하
지 않은 상태에서 게시판의 글쓰기 페이지와 수정 페이지에
들어갈 경우 로그인 화면으로 이동합니다.
No login
login
로그인 후 경로 문제
글쓰기를 통해 로그인을 하게 되면 원래 가려고 했던 경로가 아니라 항상 main page로 이동하게 된다. 때문에 원래 가려던
URI를 저장 후 이동하게 할 필요가 있었다.
AuthInterceptor - saveDest() 메소드를 이용해서 원래 사용자가 원하는 페이지
의 정보는 HttpSession에 dest라는 이름으로 저장, GET 방식인 경우 URI 정보 뒤
의 것들과 함께 보관
LoginInterceptor - 로그인 성공 후의 response.sendRedirect() 작업
에 dest'정보를 사용하게 했다.
Spring 게시판
Spring MVC Process
1. 사용자의 요청이 Front Controller에 전달 여기서 적절한 컨트롤러를 찾아서 간다.
2. 컨트롤러는 적절한 서비스 객체를 찾아서 호출
3. 서비스에서 데이터베이스의 작업을 담당하는 DAO(Data Access Object)를 이용해서 원하는 데이터를 요청
4. DAO는 MyBatis를 이용하는 Mapper를 통해서 원하는 작업을 수행
5-7. 처리한 데이터를 계속 전달하여 마지막에 뷰를 통해 결과를 보여준다.
게시판 - 글쓰기
Submit 버튼을 클릭하면
Form안에서 입력된 값들이 설정된
writePage로 이동한다.
공통경로를 /board/로 인식하게 하여
게시판 폴더에 있는 jsp들은 여기로
들어오게 했다.
Controller에 있는 writePOST에서 데이터를 처리하다가
Mybatis를 이용한 Mapper를 통해 DB에 자료가 입력된다.
정상적으로 처리된 글의 새로고침으로 인한
중복을 막기위해 리다이렉트를 이용하여 바로
목록페이지로 이동하게 했다
게시판 - 글목록
목록 출력을 위해 DAO와 Service에 listPage(Criteria cri)를 추가해 주고
Criteria 객체를 파라미터로 전달받고 필요한 getPageStart()와 getPerPageNum() 메소드를
호출한 결과를 사용하게 만들어 준다.
SQL문으로 출력될 데이터의 시작번호 부터 몇 개까지
검색해서 보여주도록 한다.
그리고 나서 Model 객체를 이용하여 전송된 데이터를
list에 담은 후 뷰로 전달하게 했다.
Jsp에서는 JSTL을 사용하여 list를 출력하면 1페이지 당
10개의 글이 보여진다.
게시판 – 페이징 처리
목록보기 하단에 페이지 번호들을 출력하기 위해서 별도의 데이터들을 저장할 PageMaker 클래스를 만들었다.
여기에 필요한 데이터는 시작 페이지 번호(startPage), 끝 페이지 번호(endPage), 전체 데이터의 개수
(totalCount), 이전 페이지 링크(prev), 이후 페이지 링크(next)이다.
페이징 처리에 필요한 모든 데이터가 담긴
PageMaker를 model 객체에 넣어주고
listPage.jsp 에 이를 보여주는 코드를 작성하
여 페이징 처리를 끝낸다.
게시판 – 글 읽기
글을 조회할 시, 해당 페이지 번호와 개수를 연동하여 글번호와
함께 전달되도록 한다.
/board/readPage?page=페이지 번호&
perPageNum=페이지당 글갯수&bno=글번호
Controller를 통해 해당하는 글 bno를 불러와 뷰에 전달하게
하여 조회가 가능하게 했다.
게시판 – 수정
readPage.jsp의 <form>태그에 있는 <input type="hidden">을
이용해서 해당 페이지와 페이지당 개수, bno값을 처리
해당하는 bno의 modifyPage 폼을 불러와 위의 SQL문을 통해
수정을 하게 만든다.
완료후엔 알림창과 함께 listPage로 이동한다.
게시판 – 삭제
이것 또한 해당하는 bno를 불러와 위의 SQL문을 통해 삭제하게 만든다.
삭제가 완료될 시에는 해당 리스트
페이지로 리다이렉트 하게 만들었다.
정상적으로 삭제하여 bno 120이 DB에서 사라졌다.

More Related Content

Similar to Jang hyun su portfolio ppt

[APM] Homepage bbs
[APM] Homepage bbs[APM] Homepage bbs
[APM] Homepage bbsKim Heejin
 
SJBoard Project Portfolio
SJBoard Project PortfolioSJBoard Project Portfolio
SJBoard Project PortfolioJuyoungKang7
 
[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request
[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request
[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http RequestNAVER D2
 
파이썬 플라스크 이해하기
파이썬 플라스크 이해하기 파이썬 플라스크 이해하기
파이썬 플라스크 이해하기 Yong Joon Moon
 
Web server page_ed10
Web server page_ed10Web server page_ed10
Web server page_ed10hungrok
 
Ksug 세미나 (윤성준) (20121208)
Ksug 세미나 (윤성준) (20121208)Ksug 세미나 (윤성준) (20121208)
Ksug 세미나 (윤성준) (20121208)Sungjoon Yoon
 
Viewpager를활용한app만들기
Viewpager를활용한app만들기Viewpager를활용한app만들기
Viewpager를활용한app만들기DaeHee Jang
 
Spring integration을 통해_살펴본_메시징_세계
Spring integration을 통해_살펴본_메시징_세계Spring integration을 통해_살펴본_메시징_세계
Spring integration을 통해_살펴본_메시징_세계Wangeun Lee
 
CRUD Pattern in Ajax
CRUD Pattern in AjaxCRUD Pattern in Ajax
CRUD Pattern in AjaxRhio Kim
 
JSP 프로그래밍 2014-2018년 기말시험 기출문제
JSP 프로그래밍 2014-2018년 기말시험 기출문제JSP 프로그래밍 2014-2018년 기말시험 기출문제
JSP 프로그래밍 2014-2018년 기말시험 기출문제Lee Sang-Ho
 
2014-15 Intermediate C++ Study #7
2014-15 Intermediate C++ Study #72014-15 Intermediate C++ Study #7
2014-15 Intermediate C++ Study #7Chris Ohk
 
신입 웹 개발자 포트폴리오 / 댓글 게시판
신입 웹 개발자 포트폴리오 / 댓글 게시판신입 웹 개발자 포트폴리오 / 댓글 게시판
신입 웹 개발자 포트폴리오 / 댓글 게시판hyeonjae Cheon
 
Metaworks3 Framework workbook 2015
Metaworks3 Framework workbook 2015Metaworks3 Framework workbook 2015
Metaworks3 Framework workbook 2015uEngine Solutions
 
JSP 빠르게 시작하기
JSP 빠르게 시작하기JSP 빠르게 시작하기
JSP 빠르게 시작하기Park JoongSoo
 
REST API Development with Spring
REST API Development with SpringREST API Development with Spring
REST API Development with SpringKeesun Baik
 
유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.
유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.
유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.ssuser6dd171
 
[NEXT] Android 개발 경험 프로젝트 3일차 (Database)
 [NEXT] Android 개발 경험 프로젝트 3일차 (Database) [NEXT] Android 개발 경험 프로젝트 3일차 (Database)
[NEXT] Android 개발 경험 프로젝트 3일차 (Database)YoungSu Son
 

Similar to Jang hyun su portfolio ppt (20)

[APM] Homepage bbs
[APM] Homepage bbs[APM] Homepage bbs
[APM] Homepage bbs
 
SJBoard Project Portfolio
SJBoard Project PortfolioSJBoard Project Portfolio
SJBoard Project Portfolio
 
[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request
[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request
[D2 CAMPUS] 안드로이드 오픈소스 스터디자료 - Http Request
 
파이썬 플라스크 이해하기
파이썬 플라스크 이해하기 파이썬 플라스크 이해하기
파이썬 플라스크 이해하기
 
Web server page_ed10
Web server page_ed10Web server page_ed10
Web server page_ed10
 
Ksug 세미나 (윤성준) (20121208)
Ksug 세미나 (윤성준) (20121208)Ksug 세미나 (윤성준) (20121208)
Ksug 세미나 (윤성준) (20121208)
 
Viewpager를활용한app만들기
Viewpager를활용한app만들기Viewpager를활용한app만들기
Viewpager를활용한app만들기
 
Spring integration을 통해_살펴본_메시징_세계
Spring integration을 통해_살펴본_메시징_세계Spring integration을 통해_살펴본_메시징_세계
Spring integration을 통해_살펴본_메시징_세계
 
CRUD Pattern in Ajax
CRUD Pattern in AjaxCRUD Pattern in Ajax
CRUD Pattern in Ajax
 
JSP 프로그래밍 2014-2018년 기말시험 기출문제
JSP 프로그래밍 2014-2018년 기말시험 기출문제JSP 프로그래밍 2014-2018년 기말시험 기출문제
JSP 프로그래밍 2014-2018년 기말시험 기출문제
 
Portfolio
PortfolioPortfolio
Portfolio
 
2014-15 Intermediate C++ Study #7
2014-15 Intermediate C++ Study #72014-15 Intermediate C++ Study #7
2014-15 Intermediate C++ Study #7
 
신입 웹 개발자 포트폴리오 / 댓글 게시판
신입 웹 개발자 포트폴리오 / 댓글 게시판신입 웹 개발자 포트폴리오 / 댓글 게시판
신입 웹 개발자 포트폴리오 / 댓글 게시판
 
Metaworks3 Framework workbook 2015
Metaworks3 Framework workbook 2015Metaworks3 Framework workbook 2015
Metaworks3 Framework workbook 2015
 
JSP 빠르게 시작하기
JSP 빠르게 시작하기JSP 빠르게 시작하기
JSP 빠르게 시작하기
 
Team Portfolio
Team PortfolioTeam Portfolio
Team Portfolio
 
REST API Development with Spring
REST API Development with SpringREST API Development with Spring
REST API Development with Spring
 
유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.
유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.
유니티 REST API를 사용한 파이어 베이스의 데이터 베이스 사용.
 
HTTP web server 구현
HTTP web server 구현HTTP web server 구현
HTTP web server 구현
 
[NEXT] Android 개발 경험 프로젝트 3일차 (Database)
 [NEXT] Android 개발 경험 프로젝트 3일차 (Database) [NEXT] Android 개발 경험 프로젝트 3일차 (Database)
[NEXT] Android 개발 경험 프로젝트 3일차 (Database)
 

Jang hyun su portfolio ppt

  • 1. Portfolio 개인 프로젝트 신입 웹 개발자 장현수 Interceptor 로그인과 Spring 게시판
  • 2. INDEX 1. 개발환경 2. Interceptor를 이용한 로그인 3. 로그인 후 경로문제 4. Spring 게시판
  • 3. 개발환경 개발 툴 : STS(Spring Tool Suite) 운영체제 : Windows7 서버 : Apache tomcat 8.0 DB : MySQL 사용한 언어 : JAVA(spring, mybatis), JSP, JavaScript, HTML/CSS 오픈소스 : Bootstrap, Jquery, Ajax
  • 4. Interceptor를 이용한 로그인 인터셉터는 preHandle과 postHandle을 이용하여 사용자의 HttpSession 처리를 담당하는 LoginInterceptor와 특정 경로에서의 사용자 로그인 상태를 체크하는 AuthInterceptor를 만들었습니다. preHandle()을 이용하여 현재 사용자가 로그인한 상태인지를 체크하고, 컨트롤러를 호출할 것인지를 결정합니다. 만약 로그 인 하지 않은 상태라면 컨트롤러에서 설정한 위치인 /member/login으로 이동합니다. Servlet-context에 인터셉터 설정정보를 등록하여 로그인 하 지 않은 상태에서 게시판의 글쓰기 페이지와 수정 페이지에 들어갈 경우 로그인 화면으로 이동합니다. No login login
  • 5. 로그인 후 경로 문제 글쓰기를 통해 로그인을 하게 되면 원래 가려고 했던 경로가 아니라 항상 main page로 이동하게 된다. 때문에 원래 가려던 URI를 저장 후 이동하게 할 필요가 있었다. AuthInterceptor - saveDest() 메소드를 이용해서 원래 사용자가 원하는 페이지 의 정보는 HttpSession에 dest라는 이름으로 저장, GET 방식인 경우 URI 정보 뒤 의 것들과 함께 보관 LoginInterceptor - 로그인 성공 후의 response.sendRedirect() 작업 에 dest'정보를 사용하게 했다.
  • 6. Spring 게시판 Spring MVC Process 1. 사용자의 요청이 Front Controller에 전달 여기서 적절한 컨트롤러를 찾아서 간다. 2. 컨트롤러는 적절한 서비스 객체를 찾아서 호출 3. 서비스에서 데이터베이스의 작업을 담당하는 DAO(Data Access Object)를 이용해서 원하는 데이터를 요청 4. DAO는 MyBatis를 이용하는 Mapper를 통해서 원하는 작업을 수행 5-7. 처리한 데이터를 계속 전달하여 마지막에 뷰를 통해 결과를 보여준다.
  • 7. 게시판 - 글쓰기 Submit 버튼을 클릭하면 Form안에서 입력된 값들이 설정된 writePage로 이동한다. 공통경로를 /board/로 인식하게 하여 게시판 폴더에 있는 jsp들은 여기로 들어오게 했다. Controller에 있는 writePOST에서 데이터를 처리하다가 Mybatis를 이용한 Mapper를 통해 DB에 자료가 입력된다. 정상적으로 처리된 글의 새로고침으로 인한 중복을 막기위해 리다이렉트를 이용하여 바로 목록페이지로 이동하게 했다
  • 8. 게시판 - 글목록 목록 출력을 위해 DAO와 Service에 listPage(Criteria cri)를 추가해 주고 Criteria 객체를 파라미터로 전달받고 필요한 getPageStart()와 getPerPageNum() 메소드를 호출한 결과를 사용하게 만들어 준다. SQL문으로 출력될 데이터의 시작번호 부터 몇 개까지 검색해서 보여주도록 한다. 그리고 나서 Model 객체를 이용하여 전송된 데이터를 list에 담은 후 뷰로 전달하게 했다. Jsp에서는 JSTL을 사용하여 list를 출력하면 1페이지 당 10개의 글이 보여진다.
  • 9. 게시판 – 페이징 처리 목록보기 하단에 페이지 번호들을 출력하기 위해서 별도의 데이터들을 저장할 PageMaker 클래스를 만들었다. 여기에 필요한 데이터는 시작 페이지 번호(startPage), 끝 페이지 번호(endPage), 전체 데이터의 개수 (totalCount), 이전 페이지 링크(prev), 이후 페이지 링크(next)이다. 페이징 처리에 필요한 모든 데이터가 담긴 PageMaker를 model 객체에 넣어주고 listPage.jsp 에 이를 보여주는 코드를 작성하 여 페이징 처리를 끝낸다.
  • 10. 게시판 – 글 읽기 글을 조회할 시, 해당 페이지 번호와 개수를 연동하여 글번호와 함께 전달되도록 한다. /board/readPage?page=페이지 번호& perPageNum=페이지당 글갯수&bno=글번호 Controller를 통해 해당하는 글 bno를 불러와 뷰에 전달하게 하여 조회가 가능하게 했다.
  • 11. 게시판 – 수정 readPage.jsp의 <form>태그에 있는 <input type="hidden">을 이용해서 해당 페이지와 페이지당 개수, bno값을 처리 해당하는 bno의 modifyPage 폼을 불러와 위의 SQL문을 통해 수정을 하게 만든다. 완료후엔 알림창과 함께 listPage로 이동한다.
  • 12. 게시판 – 삭제 이것 또한 해당하는 bno를 불러와 위의 SQL문을 통해 삭제하게 만든다. 삭제가 완료될 시에는 해당 리스트 페이지로 리다이렉트 하게 만들었다. 정상적으로 삭제하여 bno 120이 DB에서 사라졌다.