Spring/스프링 프로젝트 (14) 썸네일형 리스트형 테이블 부분 무한스크롤 구현 해당 글은 스프링 프로젝트를 처음으로 구현하는 입장에서 어떻게 각각의 기능들을 구현했는지를 정리하기 위해 작성한 글로 잘못된 정보나 불필요하거나 비효율적인 코드를 포함할 수 있음 Point 1. 페이지를 리로드하지 않고 ajax로 데이터를 추가로 가져온 뒤 기존의 태그에 붙인다. 무한스크롤은 여러 가지 구현 방식이 있겠지만 내가 시도한 방법은 스크롤이 최하단에 닿을 때, 숨겨진 페이지 번호를 증가시켜 해당 페이지 번호를 파라미터로 넘겨주어 그에 맞는 데이터를 가져온다. 이때, 페이지를 리로드하는 mvc방식이 아니라, ajax를 통해 가져온 데이터만 부분적으로 갱신해 추가한다. 한번에 데이터를 불러오지 않고 무한스크롤을 구현하는 이유는, 데이터가 많아졌을 때 로딩하는 시간을 줄이기 위해서다. 무한스크롤 페.. MySQL이용 시의 페이징2 [VO를 통한 구현] 게시판이 하나 이상이고 페이징이 필요할 경우 각각의 페이징 처리코드를 view, controller, service에 분산해 처리하기 보다는, 최소한의 코드만을 controller에 남겨두고 VO를 통해 대부분의 연산을 처리하여 재사용 가능하게 할 필요가 있다. MySQL에서 페이징 처리를 하기 위해 필요한 개념 [offset, limit]과 연산에 대한 자세한 설명은 이전의 포스팅이 다루고 있다. 2021.07.16 - [Spring/스프링 프로젝트] - MySQL이용 시의 페이징 [개별구현] VIEW ${pg.page} / ${pg.lastNum} pages 이전 이전 ${pg.startNum+i} 다음 다음 페이징 개별 처리 시 lastNum, startNum을 구하는 연산이 view단에서 이루어졌.. 페이징 구현 방식에 대한 고민 현재 구현 중인 프로젝트는 근태관리 프로그램이다. 나는 직원정보관리 및 휴가관리 파트를 맡았는데, 데이터 양이 늘어나니 별 생각 없이 일반적인 방식으로 페이징을 구현했다. 그리고 팀원들과 페이징 방식을 공유하기 위해, 기존에는 페이징을 처리하는 VO없이 view, controller, service까지 코드를 분산하여 페이징을 구현했다면 이제는 공동으로 사용할 수 있도록 페이징 처리를 위한 VO를 만드는 중이었다. 그런데 할수록 의문이 드는 게, 나는 ajax를 사용하여 실시간 필터링 검색을 구현할 계획인데, 1) 페이징 처리 이후의 자료들에 필터링 작업을 할 것인지 2) 필터링을 먼저 처리하고 검색 결과를 페이징 할 것인지 순서도 고민되고 과연 두 방식 중 하나라도 적합한가 싶었다. 1) 페이징 처리 .. MySQL이용 시의 페이징 [개별구현] 전제 MySQL을 사용하여 페이징 처리한다. 오라클 사용할 때는 해당페이지의 첫 글번호와 마지막 글번호를 구해 조건절 안에서 between a and b로 접근 MySQL에서는 limit과 offset속성을 이용 10개씩 자료를 보여주되, 총 5개 단위로 페이지 번호가 출력된다. 오라클-jsp프로젝트에서 페이징 처리했던 걸 기반으로 쿼리쪽만 바꿔 스프링 프로젝트에서 페이징을 시도해보았다. 따라서 비효율적인 방법일 확률 큼 View 1. 페이징 요소 기본 ① startNum : 현재 화면에서 시작 페이지번호 페이지번호는 한 화면에 5페이지 단위로 출력할 계획이므로, startNum은 1, 6, 11, ...가 된다. 삼항연산자 이용 : 현재 쿼리스트링으로 넘어온 page번호가 있다면 해당 값을 page에 .. 스프링에서 Ajax를 통해 JSON 데이터 주고받기 ajax를 이용한 스프링 실시간검색 구현 처음에는 Get요청을 통해 DB에서 값을 가져와 jsp에서 EL로 꺼내오는 방식을 사용했다 그러나 검색 기능을 추가하면서 키워드를 입력할때마다 거기에 맞는 데이터만 가져오게 하고 싶었다. 뷰단(클라이언트)과 자바(서버)가 새로고침없이 어떻게 상호작용할 수 있을까? 검색하다보니 ajax와 자바스크립트를 통해 가능하다는 것을 알게 된 후 구현을 시도하게 되었다. 배경지식 클라이언트의 자바스크립트 객체(데이터)를 서버단에서 사용하기 위해 (혹은 반대) 데이터를 변환하여 전송하는 방식은 3가지 csv(컴마로 구분된 문자열), xml(extensible markup language), JSON(javascript object notation) 요즘에는 경량화된 json을 .. 스프링 프로젝트 개발순서 내가 이해한 바를 바탕으로 스프링 프로젝트 개발의 전반적인 흐름을 정리했다. 이제 개발을 배우고 있는 입장이기 때문에 부정확한 내용이 많을수도 있지만, 강의 조금 듣고 프로젝트를 시작하니 어디서부터 어떻게 시작해야할지 몰라 막막했기 때문에 혹시라도 그런 사람들에게 참고가 되라고 작성한 글이다. 단 빈을 주입하는 부분이나 어노테이션, 각각의 컴포넌트가 어떻게 연결되는지에 대한 설명은 다루지 않았다. 나중에 수정될 예정 데이터를 넘겨주는 방식 1. QueryString : 간단한 문자열과 주소창에 노출돼도 상관없는 정보 Get 2. Form : 일반적으로 가장 많이 사용되는 방식 Post가 기본 기타 : Session, Cookie [꼭 뷰단에서 설정해주는 내용은 아님, 뷰단에서 하지 않는 게 바람직하다] .. 스프링 a태그에서 confirm 이용하기, 쿼리스트링으로 값 전달 취소 form과 input 쿼리스트링과 a태그 어찌보면 당연한데, 인풋태그를 사용하지않고 쿼리스트링으로 값을 컨트롤러까지 전달하려할 때 form을 결합해서 사용할 수 없다. 다음과 같이 시도했다가 실패 승인 form은 넘어가나 데이터가 전달되지 않는다. 수정된 모습 거절 스프링 컨트롤러에서 쿼리스트링, 혹은 인풋 값을 받는 방법은 세가지가 있는듯하다. 1. 파라미터로 어노테이션, 자료형, 이름 그대로 입력하기 @GetMapping("cancel") public String cancel(@RequestParam String id){ } 이 방법이 좋은 이유는, String으로 입력된 값을 (숫자의 형태일 경우) int로 자동 변환이 가능하다. (@ReqeustParam int id)가 가능 2. Reque.. 시큐리티 알게된 내용 정리 security-context.xml 참고해서 파악한 시큐리티 로그인 흐름 0. 로그인 1. (내부 컨트롤러)에서 서비스 호출 2. CustomerUserDetailsService 1) read()[우리가 정의해준 메소드]를 통해 직원 DB가져옴 2) DAOMapper.xml 참고 - read() : emp_id, emp_pw, emp_name, emp_level을 가져온다 - 이 값이 세션에 저장됨 3) 가져와서 Member객체에 일단 넣고, 권한(emp_id, emp_level) 데이터는 다시 한번 Auth 객체를 생성해 Member 객체에서 변수로 가진다. 4) 리턴된 Member객체를 컨트롤러로 넘겨줌 (여기서 컨트롤러는 시큐리티가 제공하는 내장 컨트롤러라 확인 불가) 3. (내부 컨트롤러)에서 .. 이전 1 2 다음
