시스템 아키텍처 및 주요 기술 스택

본 프로젝트는 현대적인 웹 개발 표준을 따르기 위해 백엔드는 SpringBoot, 프론트엔드는 Vue.js 아키텍처를 채택하였습니다. 이를 통해 개발 효율성을 높이고 유지보수가 용이한 구조를 설계했습니다.

1. 백엔드 프레임워크: SpringBoot

SpringBoot는 Tomcat, Jetty와 같은 내장 서버를 포함하고 있어 별도의 WAS 설정 없이 독립적인 실행이 가능합니다. 특히 '자동 설정(Auto-configuration)' 기능을 통해 라이브러리 의존성에 따른 설정을 최적화하며, Spring Data JPA나 Spring Security와 같은 강력한 에코시스템을 쉽게 통합할 수 있습니다. 이는 개발자가 비즈니스 로직에만 집중할 수 있는 환경을 제공합니다.

2. 프론트엔드 프레임워크: Vue.js

Vue.js는 가상 DOM(Virtual DOM) 기술을 기반으로 효율적인 UI 렌더링을 수행합니다. 데이터 바인딩과 컴포넌트화된 구조를 통해 복잡한 사용자 인터페이스를 체계적으로 관리할 수 있으며, 데이터 상태 변화에 따라 화면이 실시간으로 반응하는 인터랙티브한 독서 환경을 구축하는 데 적합합니다.

3. 데이터 액세스 계층: MyBatis-Plus

MyBatis-Plus는 기존 MyBatis의 장점을 유지하면서도 CRUD 작업을 자동화하여 개발 생산성을 극대화한 프레임워크입니다. 별도의 SQL 작성 없이도 기본 기능을 수행할 수 있으며, 복잡한 쿼리는 XML이나 어노테이션을 통해 유연하게 처리할 수 있습니다. 또한 페이지네이션(Pagination) 및 동적 SQL 생성 기능을 내장하여 데이터베이스 제어를 단순화합니다.

품질 보증을 위한 시스템 테스트

시스템의 안정성을 확보하기 위해 기능 테스트와 블랙박스 테스트를 수행하였습니다. 특히 사용자 경험에 직결되는 주요 모듈을 중심으로 시나리오 기반의 검증을 진행했습니다.

로그인 기능 테스트 시나리오

핵심 소스코드 구현

다음은 사용자의 인증을 처리하고 토큰을 생성하는 백엔드 로직의 핵심 구성 요소입니다.

// 인증 컨트롤러 및 로그인 로직
@RestController
@RequestMapping("/api/auth")
public class AuthController {

    @Autowired
    private MemberService memberService;
    
    @Autowired
    private JwtTokenService jwtTokenService;

    @PostMapping("/login")
    public ResultResponse login(@RequestBody LoginRequest loginRequest) {
        // 회원 정보 조회
        MemberEntity member = memberService.selectOne(
            new QueryWrapper<MemberEntity>().eq("account", loginRequest.getUsername())
        );

        // 검증 로직
        if (member == null || !member.getPassword().equals(loginRequest.getPassword())) {
            return ResultResponse.error("ID 또는 비밀번호가 올바르지 않습니다.");
        }

        // 토큰 발급
        String token = jwtTokenService.createToken(member.getId(), member.getAccount(), "members", member.getRole());
        return ResultResponse.ok().put("token", token);
    }
}

// 인터셉터를 활용한 권한 검증
@Component
public class SecurityInterceptor implements HandlerInterceptor {

    @Autowired
    private JwtTokenService tokenService;

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        // CORS 및 옵션 요청 처리
        if (RequestMethod.OPTIONS.name().equals(request.getMethod())) {
            response.setStatus(HttpServletResponse.SC_OK);
            return true;
        }

        // 인증 제외 어노테이션 확인
        if (!(handler instanceof HandlerMethod)) return true;
        IgnoreAuth ignoreAuth = ((HandlerMethod) handler).getMethodAnnotation(IgnoreAuth.class);
        if (ignoreAuth != null) return true;

        // 헤더에서 토큰 추출 및 검증
        String authToken = request.getHeader("X-Auth-Token");
        TokenEntity sessionToken = null;
        if (StringUtils.isNotBlank(authToken)) {
            sessionToken = tokenService.findByToken(authToken);
        }

        if (sessionToken != null) {
            request.setAttribute("currentUserId", sessionToken.getUserId());
            return true;
        }

        // 인증 실패 처리
        response.setContentType("application/json;charset=UTF-8");
        response.getWriter().print(JSON.toJSONString(ResultResponse.error(401, "인증이 만료되었습니다. 다시 로그인해주세요.")));
        return false;
    }
}

데이터베이스 스키마 설계

사용자 인증 세션을 관리하기 위한 토큰 저장 테이블 구조는 다음과 같습니다.

CREATE TABLE `authentication_token` (
  `id` bigint(20) NOT NULL AUTO_INCREMENT PRIMARY KEY,
  `member_id` bigint(20) NOT NULL COMMENT '회원 PK',
  `account_name` varchar(100) NOT NULL COMMENT '계정명',
  `source_table` varchar(100) DEFAULT NULL COMMENT '참조 테이블',
  `user_role` varchar(50) DEFAULT NULL COMMENT '권한 등급',
  `access_token` varchar(255) NOT NULL COMMENT '액세스 토큰',
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '생성일시',
  `expire_at` timestamp NOT NULL COMMENT '만료일시',
  INDEX `idx_token_value` (`access_token`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='인증 토큰 관리 테이블';