[구현] projectSn 세션처리

구현

- projectSn(프로젝트 일련번호) 세션 처리 -

---

KeyPoint
- HttpServletRequest request
- HttpSession session = request.getSession()
- session.setAttribute()

 

---

 

들어가기 전에

기존에 로그인화면을 구현하면서 사용자정보는 세션 처리를 완료했다.

구현 내용은 아래 게시물 참고.

 

▶ 로그인 화면 구현

[구현] 로그인 화면 구현

 

Project Management System을 구축하면서 중점에 뒀던 부분 하나가 "프로젝트 별"로 대시보드/업무 등을 구분하는 것이었다.

이를 위해서는 projectSn(프로젝트 일련번호) 역시 세션처리가 불가피했는데 로그인 정보를 처리하면서 해당 사용자가 참여중인 프로젝트의 번호를 넣으려고 하다가 정보는 1가지인데 프로젝트는 여러 개가 될 수 있어 로그인 정보에서는 제외시켰다. (실제로 넣었다가 에러남)

이에 따라 일단 로그인이 되면 프로젝트 목록 화면으로 이동시키고, 프로젝트를 눌렀을 때 어차피 대시보드로 이동하게끔 하려고 구상했으니, 프로젝트를 선택했을 때 세션에 저장하기로 했다.

 

---

projectSn 세션 처리

▶ 로직

프로젝트 목록 화면에서 프로젝트 명을 클릭

> 프로젝트 정보에서 projectSn을 JSON 데이터로 변환하여 axios.post로 컨트롤러단에 전송

> 컨트롤러단에서 projectSn을 받아 session 설정

> 세션 처리 후 js에서 "$(location).attr("href","url")"를 이용해 대시보드 화면으로 이동

 

▶ 설명

1. 프로젝트명 클릭

프로젝트명을 클릭하면 @click="goDashboard(list)"로 projList.js의 goDashboard(list) 함수 호출

<!-- proj_list.jsp -->
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" import="java.util.*"%>
<project-list inline-template ref='projList'>
    <div>
        <div class="card-header">
            <h2 style="color:blue;">참여중인 프로젝트</h2>
        </div>
        <div class="card-body">
            <div v-for="list in list">
                <table class="table table-bordered table-hover">
                    <tr>
                        <th colspan="2" @click="goDashboard(list)">{{list.projectNm}}</th>
                    </tr>
                    <tr>
                        <td colspan="2">{{list.projectCtn}}</td>
                    </tr>
                    <tr>
                        <td>프로젝트 참여기간</td>
                        <td>{{list.projectBegDt}} <span>~</span> {{list.projectEndDt}}</td>
                    </tr>
                    <tr>
                        <td>PM : {{list.pmNm}} </td>
                        <td><span style="cursor:pointer;" @click="getMembers(list.projectSn)">참여인원 : {{list.personCnt}}명</span></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</project-list>

// projList.js 중 goDashboard(list) 함수
goDashboard(list) {
    alert(list.projectNm+'의 대시보드로 이동합니다.');
    
    var data = {
        'projectSn' : list.projectSn
    }
    var jsonData = JSON.stringify(data);
    
    axios.post('/pmsProject/project/setProjectSn.do', jsonData, {
        headers : {
            'Content-Type' : 'application/json'
        }
    })
},

 

2. Controller

리턴 값이 필요없으므로 void 메서드로 선언

// 프로젝트 세션 설정
@RequestMapping(value = "/project/setProjectSn.do", method = RequestMethod.POST)
@ResponseBody
public void setProjectSn(@RequestBody ProjectVO project, HttpServletRequest request) {
    HttpSession session = request.getSession();
    // projectSn 세션 설정
    session.setAttribute("projectSn", project.getProjectSn());
}

 

3. projList.js

axios.post 마지막에 .then(function(){})로 axios.post가 끝난 후 처리할 내용을 코딩

여기서는 대시보드로 이동해야하므로 $(location).attr('href','url')을 이용하여 대시보드 화면으로 이동시켰다.

// projList.js 중 goDashboard(list) 함수
goDashboard(list) {
    alert(list.projectNm+'의 대시보드로 이동합니다.');
    
    var data = {
        'projectSn' : list.projectSn
    }
    var jsonData = JSON.stringify(data);
    
    axios.post('/pmsProject/project/setProjectSn.do', jsonData, {
        headers : {
            'Content-Type' : 'application/json'
        }
    }).then(function(){
        $(location).attr('href','/pmsProject/project/dashboard.do');
    });
},

 

4. Dashboard Controller

임의로 dashboard.jsp 화면을 하나 생성하고, 컨트롤러 내에서 화면을 리턴하는 메서드를 선언

package pms.controller;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

import pms.service.DashboardService;
import pms.vo.UserVO;

@Controller
public class DashboardController {

    @Autowired(required = false)
    DashboardService service;

    @RequestMapping(value = "/project/dashboard.do", method = RequestMethod.GET)
    public String dashboard(HttpServletRequest request, HttpServletResponse response) {

        HttpSession session = request.getSession();

        // user객체가 null이면(== 로그인 정보가 없으면)
        if (session.getAttribute("user") == null) {
            // 로그인 화면으로 이동
            return "redirect:/ppm/login.do";
        } // projectSn 값이 null이면(== 프로젝트 선택을 하지 않은 상황이면)
        else if (session.getAttribute("projectSn") == null) {
            // 프로젝트 목록으로 이동
            return "redirect:/proejct/project.do";
        } // 전부 세션에 저장되어 있다면
        else {
            // 세션값 확인
            UserVO user = (UserVO) session.getAttribute("user");
            
            System.out.println("#####################");
            System.out.println("#####################");
            System.out.println("로그인정보: " + user.getUserId());
            System.out.println("프로젝트번호: " + session.getAttribute("projectSn"));
            System.out.println("#####################");
            System.out.println("#####################");
            
            // 대시보드로 이동
            return "/WEB-INF/pmsPrj/jsp/proj/dashboard/dashboard";
        }
    }
}

 

---

확인

honggildong 이라는 아이디로 로그인하고 projectSn = 7777인 것으로 이동한 후 콘솔을 확인했다.

정상적으로 넘어온 것을 확인.

 

---

 

 

 

 

 

End.

heisely's 괴발개발 개발일지