-
알림 기능 구현을 사이드 프로젝트에서 담당하여 진행중에, 알람 표시 날짜를 n일전, n주전, n달전...으로 해달라는 요청을 받았다.
변경 전에는 그냥 알람창을 누르면 현재 날짜와 시간이 뜨도록 해뒀었다..
의미없이 다 똑같은 시간들 ^-^... [구현 방법]
1. MySQL DB의 notice 테이블에 저장되어있는 noti_create 컬럼과 현재시간을 비교하여
현재 시간 - 알림 생성 시간 을 초(sec) 단위로 변환하기
2. 변환한 초를 분, 시, 일, 주, 달, 연도 로 표기하기
1️⃣[Controller]
final 상수를 선언하여 초, 분, 시, 일, 주, 달, 연도에 관련된 클래스와 비교 로직 클래스 생성한다.
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758//알림 시간 설정(n일전, n주전, n달전, n년전)private static class TIME_MAXIMUM {public static final int SEC = 60;public static final int MIN = 60;public static final int HOUR = 24;public static final int DAY = 7;public static final int WEEK = 4;public static final int MONTH = 12;}public static String formatTimeString(int diffTime) {String msg = null;if (diffTime < TIME_MAXIMUM.SEC) {msg = "방금 전"; // sec} else if ((diffTime /= TIME_MAXIMUM.SEC) < TIME_MAXIMUM.MIN) {msg = diffTime + "분 전"; // min} else if ((diffTime /= TIME_MAXIMUM.MIN) < TIME_MAXIMUM.HOUR) {msg = (diffTime) + "시간 전"; // hour} else if ((diffTime /= TIME_MAXIMUM.HOUR) < TIME_MAXIMUM.DAY) {msg = (diffTime) + "일 전"; // day} else if ((diffTime /= TIME_MAXIMUM.DAY) < TIME_MAXIMUM.WEEK) {msg = (diffTime) + "주 전"; // week} else if ((diffTime /= TIME_MAXIMUM.WEEK) < TIME_MAXIMUM.MONTH) {msg = (diffTime) + "달 전"; // month} else {diffTime /= TIME_MAXIMUM.MONTH;msg = (diffTime) + "년 전"; // year}return msg;}@RequestMapping(value = "/memberPush", method = RequestMethod.POST)@ResponseBodypublic HashMap <String, Object> memberPush(HttpSession session, Model model) throws Exception {logger.info("memberPush");HashMap<String, Object> result = new HashMap <String,Object>();TogetherMemberVO vo = (TogetherMemberVO) session.getAttribute("member");String memberEmail = vo.getM_email();List<MemberNoticeVO> notice = memberNoticeService.notiList(memberEmail);for(MemberNoticeVO notiVO : notice) { // 날짜 포맷 변경notiVO.setNoti_time(formatTimeString(notiVO.getComparetime()));}if (notice.size() > 0) {String size = "1";result.put("size", size);result.put("notice", notice);}return result;}cs 알림 화면은 비동기식으로 띄우기 위해 AJAX를 이용했다!
여기서 사용한 Mapper.xml 의 쿼리는 다음과 같다.
2️⃣[Mapper.xml]
1234<select id="notiList" resultType="MemberNoticeVO">SELECT *, TIMESTAMPDIFF(SECOND, NOTI_CREATE, NOW()) AS comparetime FROM MEMBER_NOTICEWHERE m_email = #{m_email} order by noti_num DESC</select>cs MySQL의 TIMESTAMPDIFF 함수를 이용해서 초 단위의 차이를 가져왔다.
resultMap을 사용하기 번거로워서 VO에 comparetime 과 noti_time를 추가했다.. (이래도 되는거겠지?)
✨결과 화면✨
n일, n주, n달, n년 전까지 정상적으로 뜨는 것 확인 완료! :D
'프로그래밍 > Back-end' 카테고리의 다른 글
[Nest.js] Nest js 로 게시판 만들기 (1) (0) 2022.05.15 [TypeORM] How to auto-remove orphaned rows in TypeORM? (0) 2022.05.01 댓글