Spring + MyBatis + DB = 작은 웹사이트 - (4) 로그인 기능 구현

지난번에 DB 연결을 해두긴 했지만 과연 잘 된건지 의심스럽다.

나중에 다시 수정해야한다는 번거로움이 있지만 일단 간단하게 홈화면에 로그인 화면을 구현해서 테스트를 해보고 넘어간다.

1. 데이터 만들기

로그인하려면 아이디, 패스워드 등의 데이터가 기록되는 테이블이 필요하다.

아직 테이블을 만들지 않았으니 이참에 테이블을 만들면서 관리자도 만들어준다.

CREATE TABLE `myhome`.`user` (

  `id` VARCHAR(45) NOT NULL COMMENT 'id',

  `pw` VARCHAR(45) NOT NULL COMMENT 'password',

  `nm` VARCHAR(45) NOT NULL COMMENT 'user name',

  PRIMARY KEY (`id`),

  UNIQUE INDEX `id_UNIQUE` (`id` ASC));

INSERT INTO myhome.user

VALUES ('아이디', '비밀번호', '이름');

COMMIT;

2. 로그인 화면 + 소스 구현

이제 이클립스로 가서 코딩을 시작할 차례다.

우선은 home.jsp에 아이디, 패스워드 입력창과 로그인 버튼을 대충 넣어준다.

원래 home.jsp의 body에 있던 소스는 지우고 아래 소스를 넣었다.

<form action="login" method="POST" name="loginform">

ID : <input type="text" id="id" name="id" />

<br>

PW : <input type="text" id="pw" name="pw" />

<br>

<button id="loginBtn" type="submit"> Login </button>

</form>

대충 만드는 중이고 관리자 아이디의 비밀번호도 알고 있지만 로그인에 실패할 경우를 대비하여 별도의 jsp를 하나 더 생성한다. 

src > main > webapp > WEB-INF > views 아래에 fail.jsp를 하나 만들고 

body에는 그냥 "로그인 실패" 만 적어놨다. 

지난번에 DB 연결을 하면서 root-context.xml 안에 sqlSessionFactory 빈을 생성하긴 했지만 완벽하게 구현하진 않았다. 

처음 프로젝트 개발 환경을 구축하면서 MyBatis를 쓰기로 했다.

MyBatis를 쓰면 소스 코드에서 SQL을 분리해서 별도의 XML 파일에 선언하고 별도로 관리할 수 있다.

대신 이렇게 하려면 컨피그와 매퍼가 어디있는지 알려주는 작업이 필요하다. 아래와 같이 root-context.xml의 일부를 수정해준다.

<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">

<property name="dataSource" ref="dataSource" />

<property name="configLocation" value="classpath:mybatis/config/mybatis-config.xml" />

<property name="mapperLocations" value="classpath*:mybatis/mapper/*-mapper.xml" />

      </bean>

value에 입력한 경로는 컨피그와 매퍼 xml 파일의 경로인데, 아직 생성한 게 없다. 

위에서 선언한 경로대로 폴더 구조를 만들어준다.

scr > main > resources 아래에 mybatis 라는 폴더를 만들고 그 안에 각각 config, mapper 라는 폴더를 생성해줬다.

config 폴더 안에는 mybatis-config.xml 파일을 생성하고 소스 작성은 일단 뒤로 미뤘다.

mapper 폴더 안에도 일단 admin-mapper.xml 파일을 생성해둔다. 

폴더 구조가 아래처럼 생성됐다.

드디어 자바 소스를 만들 때가 왔다. 

src > main > java 밑에 패키지를 쭉쭉 만들었다. 

지금 내가 만들 웹사이트는 관리자만 로그인할 수 있게 할 예정이라 

'admin' 이라는 이름의 패키지 안에 로그인 관련 소스들을 작성했다.

먼저 admin 패키지를 생성하고 그 안에 ctr, svc, dao, vo 패키지를 차례로 생성했다. 

각 파일 내부의 소스는 아래와 같다. 

package com.blog.home.admin.ctr;

import javax.servlet.http.HttpSession;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Controller;

import org.springframework.ui.Model;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RequestParam;

import com.blog.home.admin.svc.AdminSvc;

import com.blog.home.admin.vo.AdminVO;

@Controller

public class AdminCtr {

@Autowired 

private AdminSvc svc;

@RequestMapping("/login")

public String adminLogin(@RequestParam("id") String id, @RequestParam("pw") String pw, HttpSession session, Model model) {

String admin = svc.adminLogin(new AdminVO(id, pw));

if(admin != null) {

session.setAttribute("admin", admin);

return "home";

}else {

return "fail";

}

}

}

package com.blog.home.admin.svc;

import com.blog.home.admin.vo.AdminVO;

public interface AdminSvc {

String adminLogin(AdminVO adminVO);

}

package com.blog.home.admin.svc;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Service;

import com.blog.home.admin.dao.AdminDao;

import com.blog.home.admin.vo.AdminVO;

@Service

public class AdminSvcImpl implements AdminSvc{

@Autowired 

private AdminDao dao;

@Override

public String adminLogin(AdminVO adminVO) {

return dao.adminLogin(adminVO);

}

}

package com.blog.home.admin.dao;

import org.apache.ibatis.session.SqlSession;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Repository;

import com.blog.home.admin.vo.AdminVO;

import common.dao.AbstractDAO;

@Repository

public class AdminDao extends AbstractDAO {

@Autowired private SqlSession sql;

private static final String NAMESPACE = "AdminMapper.";

public String adminLogin(AdminVO adminVO) {

return sql.selectOne(NAMESPACE + "adminLogin", adminVO);

}

}

package com.blog.home.admin.vo;

import java.io.Serializable;

public class AdminVO implements Serializable{

private String id;

private String pw;

private String nm;

public AdminVO() {}

public AdminVO(String id, String pw) {

super();

this.id = id;

this.pw = pw;

}

public AdminVO(String id, String pw, String nm) {

super();

this.id = id;

this.pw = pw;

this.nm = nm;

}

public String getId() {

return id;

}

public void setId(String id) {

this.id = id;

}

public String getPw() {

return pw;

}

public void setPw(String pw) {

this.pw = pw;

}

public String getNm() {

return nm;

}

public void setNm(String nm) {

this.nm = nm;

};

}

이제 아까 만들어둔 xml 파일들을 채워넣어야 할 차례가 왔다. 

컨피그와 매퍼 모두 필요할 것 같다. 둘 다 작성해준다. 

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE configuration

  PUBLIC "-//mybatis.org//DTD Config 3.0//EN"

  "http://mybatis.org/dtd/mybatis-3-config.dtd">

  <configuration>

  <typeAliases>

  <typeAlias type="com.blog.home.admin.vo.AdminVO" alias="admin"/>

 

  </typeAliases>

  </configuration>

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE mapper

  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"

  "http://mybatis.org/dtd/mybatis-3-mapper.dtd">

  <mapper namespace="AdminMapper">

  <resultMap id="admin" type="admin">

  <id property="id" column="id" />

<result property="pw" column="pw" />

  </resultMap>

 

  <!-- 관리자 로그인 시 -->

<select id="adminLogin" parameterType="admin" resultType="java.lang.String">

SELECT NM

 FROM USER

  WHERE ID = #{id}

    AND PW = #{pw}

</select>

  </mapper>

이제 정말로 필요한 소스는 모두 집어넣은 듯 하다...

톰캣 서버를 구동시켜서 들어가보면 아래와 같이 로그인 시도를 할 수 있는 입력창이 보인다. 

로그인 성공 시에 다시 홈화면으로 돌아가게 했으므로 정상적으로 처리되면 로그인 버튼 클릭 후 다시 처음 화면이 나타난다.

반면 로그인에 실패하게 되면 아래와 같이 fail.jsp 화면이 나타난다.