들어가며
우리 학과는 3학년 2학기부터 '창의융합설계'라는 이름으로 프로젝트 설계 과목을 진행한다. '창의융합설계' 과목은 3학년 1학기까지 배운 내용을 바탕으로 팀을 짜서 자신들이 정한 주제에 맞는 프로젝트를 개발하는 과목이다.
팀원 모집은 주로 학과 생활을 하면서 같이 수업들은 친구들 위주로 모여진다. 하지만 나는 학과 활동보단 동아리 활동(미담장학회라는 교육 봉사 동아리)을 더 열심히 했기 때문에 학과 게시판을 통해 모집했다.
그 후, 첫 미팅에서 팀 주제를 정했는데 우리 팀은 내가 활동하던 동아리의 불편함을 해소하자! 라는 주제로 정해졌다. 미담장학회라는 이름의 동아리는 교육 봉사 동아리로 전국 13개 학교에서 활동하는 전국 연합동아리다. 주로 지역아동센터나 중고등학생 대상으로 국영수, 코딩 교육을 진행한다.
나는 그 동아리에서 당시 2년 간 회장을 역임했는데 멘토링 보고서 관리나 출석 관리를 수기로 관리해서 너무 귀찮았다. 그래서 이번 프로젝트를 통해 원스톱으로 해결할 수 있는 ERP 기반의 '미담 멘토 관리 시스템'을 개발하기로 했다.
(추신. 당시 깃허브 조작이 미숙하여 소스 코드를 모두 날렸기 때문에 프로젝트 발표 ppt 내용을 기반으로 작성한다.)
프로젝트 개요
문제 정의 및 목표
미담장학회는 전국 대학생들이 모여 교육 기부를 통해 계층 간 교육 격차를 줄여 공익에 기여하는 비영리 NGO 단체이다. 그 중 금오공과대학 지역본부는 금오공대생으로 구성된 동아리로 구미시 옥계동에 위치한 행복나무지역아동센터와 연계하여 매 학기마다 금오공대생으로 이뤄진 멘토를 선발하고 관리하고 있다.
멘토 선발은 네이버 폼을 통해 신청 받아 면접을 통해 선발하고 선발된 멘토는 네이버 카페를 통해 관리하고 있다. 멘토링이 끝난 후, 멘토는 네이버 카페에 활동보고서를 작성한다. 이를 미담장학회 담당자가 확인한 후, 수기로 작성한 지역아동센터 출석 대장과 비교해본 후 일치하면 댓글을 남긴다. 지역아동센터 담당자는 글마다 댓글을 확인하며 봉사시간 등록을 위해 1365와 연동 가능한 엑셀 양식에 맞춰 멘토링 일지를 작성한다. 이때 멘토 명단을 보면서 1365 아이디를 일일이 확인해야 한다. 멘토링 지도학생(멘티)는 지역아동센터 관할이며 미담장학회에서 관리하지 않는다.
이러한 방식은 멘토 규모가 커짐에 따라 혼란과 불편이 커지고 있다. 이에 금오공과대학 미담장학회 지역본부는 웹 기반 멘토 통합관리시스템을 구축하고 QR코드를 활용한 전자출입명부 기술을 도입해 지역아동센터 멘토링 출석 대장 관리를 보다 쉽게 하고 기존에 네이버 카페에서 관리하던 멘토링 활동보고서를 더 효율적으로 관리하고 이를 자동으로 멘토 명단과 연동하여 양식에 맞춰 엑셀 파일로 변환시켜 지역아동센터에서 1365에 등록하기 더 쉽게 하고자 한다.
대표 사용자 인터페이스
프로젝트 스펙
-
Front-end : React & 부트스트랩
-
Back-end : Spring
-
Database : MySQL
프로젝트 이슈
1. Springboot Security & JWT
프로젝트를 진행하면서 가장 먼저 맞닥뜨린 문제는 Spring Security & JWT이다. Spring에서는 보안을 강화하기 위해 Security라는 프레임워크를 제공한다.
지금에서는 Spring security의 기본 로직을 어느 정도 이해할 수 있기 때문에 권한 핸들링을 할 수 있지만 그 당시에는 Spring의 S자도 몰랐기 때문에 필터가 무엇인지, 권한 매핑이 무엇인지 전혀 이해할 수 없었다. 심지어 UserDetail 객체를 상속받아 User 모델을 구축해야하는데 상속이란 개념 자체도 이해하지 못했다.(부끄럽다...)
이에 나는 Spring security 프레임워크 자체를 들어내버렸다. Spring boot와 Spring security를 처음부터 공부할 시간이 없었고 지금 당장의 이해도도 낮앗기 때문에 이를 사용하는 것은 오히려 독이라고 생각했다.
그 후 나는 유일하게 이해할 수 있었던 AOP 기능을 활용하기로 했다. 클라이언트에서 서버에게 로그인 요청을 하면 DB 유저 조회를 진행, 성공하면 JWT 토큰 페이로드에 '성공'이라는 값을 담아서 반환하고 실패하면 404 메시지를 반환하였다.
다른 기능에 접근할 때, AuthAOP를 통해 토큰이 있는지 없는지 확인하고 있으면 페이로드 값에 '성공'이 담겨있는지, 유효시간이 지났는지 체크했다.
위 로직을 통해 어느정도 유효한 로그인 서비스를 제공할 수 있었지만 여기에 몇 개의 기술 부채를 남기며 개발을 마무리 지었다.
-
토큰을 통해 로그인 성공, 실패만 확인할 수 있기 때문에 권한 관리 및 매핑을 Front에서만 처리해야 한다.
-
세션을 사용하지 않기 때문에 토큰이 중간에 탈취 당할 경우 보안에 매우 취약하다.
-
관리자와 일반 유저의 토큰이 차이가 없기 때문에 일반 유저가 마음만 먹으면 관리자 페이지를 조회할 수 있다.
2. HTTP & HTTPS
미담 멘토 관리 시스템은 출석을 QR코드로 관리했다. 유저의 아이디와 활동 명, 담당 지역아동센터 데이터를 QR로 만들어서 사이트에 비추면 Front 부분에서 이를 해석해 서버로 전송하는 로직이다. 이때 QR은 학생 개인 정보 페이지에서 만들 수 있었고 QR 인식 기능은 관리자 페이지에서 제공하였다.
이때 문제가 발생했다. 우리 프로젝트는 반응형 웹 기반이라 모바일에서도 QR 인식 페이지를 제공해야 하는데 웹사이트에서 모바일 기기에 접근하기 위해서는 HTTPS 통신을 해야한다. 왜냐하면 통신을 하는 중에 사용자의 개인 정보가 탈취당할 가능성이 높기 때문에 HTTPS를 제외한 사용한 기기 접근을 원천적으로 막았다.
실제 배포하는 경우에는 SSL을 발급받으면 되지만 개발 단계에서 SSL을 발급 받아 진행하는 것은 너무 번거로웠다. 이에 우리는 쉽게 HTTPS를 통해 테스트 할 수 있는 방법이 필요했다.
이에 우리가 선택한 방법은 ngrok을 사용하는 것이다. ngrok은 외부에서 로컬로 접속할 수 있게 해주는 커널링 프로그램으로 http 기반이다. 이때 HTTPS도 제공해주기 때문에 로컬 환경에서 모바일 기기의 카메라 제어를 확인할 수 있었다.
3. 지문인식센서
미담 멘토 관리 시스템에서 근태 관리는 QR로 관리했다. 하지만 대리 출석이나 탈취의 가능성이 높아 보안적으로 취약하다는 교수님 피드백을 받았다. 그래서 교수님이 보안성을 강화할 수 있는 방안을 마련해오라 했고 우리는 지문 인식 센서를 추가해서 QR 코드와 지문을 사용해서 보완성을 높이기로 했다.
초기에는 지문인식센서 + 아두이노 조합을 사용했다. 아두이노는 학교 수업에서 배웠기 때문에 수월하게 사용할 수 있었다.
이때 유저 체크에 관해서 문제가 발생했다. 이 문제를 알기 위해선 우선 지문인식센서의 지문 판별 로직에 대해서 알아야 한다. 지문 인식센서는 다음과 같이 동작한다.
- 지문을 스캔한다.
- 스캔한 지문을 이미지 버퍼에 저장한다.
- 이미지 버퍼에 저장된 데이터를 캐릭터 데이터로 축약한 다음 캐릭터 버퍼에 저장한다.
- 그 후 센서 내부 데이터베이스에 저장된 유저 지문 데이터를 불러와 특징값 추출 알고리즘으로 판별
- 일치하는 값이 있으면 유저 데이터 반환, 없으면 데이터 저장
위 로직으로 근태관리를 할 경우, 지역아동센터를 옮길 때 마다 지문인식센서에 새로 등록해야하며, 센서를 바꿀 경우에도 기존의 멘토들은 새로 지문을 등록해야 했다. 즉 지문인식 기능은 지문인식센서에 종속적이다.
이에 우리는 특이점을 활용한 지문 판별 로직과 지문 데이터 저장을 서버에서 처리하기로 했다. 처음에는 센서에서 제공하는 특징점 추출 알고리즘을 그대로 구현하기로 했다. 그러나 엄청난 삽질 구글링해도 어떤 알고리즘으로 구현했는 지 찾지 못했다.
그래서 우리는 논문을 보고 직접 구현해보자! 라는 의견이 나왔다. 우선 이미지 버퍼에서 이미지를 바로 가져온 다음 서버에서 특징점 추출을 진행하기로 했다. 이미지 버퍼에서 데이터를 가져올 때, 오버플로우가 발생했다.
아두이노에서 이미지 파일을 받고 이를 이미지로 복원하는 과정에서 지문이 모두 깨지는 현상이 나타났다. 팀원들에게 양해를 구하고 한 2주간 이 문제만 잡고 있었다. 처음에는 이미지 복원 문제인 줄 알고 Python으로 다양한 라이브러리를 사용해봤고 논문까지 읽었다.
그러다 센서 스펙을 자세하게 다룬 외국 블로그(오래되서 어떤 블로그였는 지 못찾겠다.)를 읽었는데 거기서 언급한 이미지 버퍼 바이트 값과 내가 받아온 바이트 값의 크기가 다르다는 것을 발견했다.
바로 아두이노에서 센서와의 통신 속도를 조절해봤다. 그러니 전과 비교했을 때 더 많은 데이터가 날아왔다. 센서에서 데이터를 보내는 속도와 아두이노의 수신 속도 차이가 컸고, 그 차이를 아두이노 수신 버퍼가 감당할 수 없었던 것이다.
아두이노의 수신 속도를 최대로 하고 시리얼 인터셉트 방식을 사용해보는 듯 여러 방법을 사용해봤으나 센서와 아두이노의 통신 속도 차이를 극복해내지 못했다.(OTL ㅜㅜ) 그래서 아두이노를 라즈베리파이로 바꿔버렸다. 이미지가 매우 잘 넘어왔다. 비싼 게 참 좋다.
4. 지문인식 알고리즘
이제 받아온 이미지로 특징점 추출 알고리즘을 구현해야했다. 그러나 이미 위 단계에 시간을 너무 많이 써서 논문을 찾아보며 구현해볼 시간이 부족했다. 그래서 어떻게 해야하나 고민을 하던 중 재밌는 유튜브 영상을 발견했다.
딥러닝으로 지문인식 인공지능 만들기 - Python, Deep Learning With 빵형의 개발 도상국
위 유튜브 영상을 간략하게 정리하면 kaggle에서 아프리카 대륙인들의 지문 데이터를 제공하고 이를 기반으로 딥러닝 기반의 지문 인식 모델을 구축하는 내용이다. 지문 판별 로직은 두 지문이 일치하면 1(True), 불일치하면 0(False)에 가깝게 반환한다. 통상적으로 같은 사람의 지문은 0.95 정도의 값으로 반환되었다.
위 모델을 활용하여 우리는 지문 센서에서 이미지 버퍼의 이미지 데이터를 가져와 서버로 부터 해당 지역아동센터에 등록된 멘토의 지문 이미지를 받아와 비교하여 0.95(기준) 이상인 경우, 해당 멘토로 식별하는 로직이 완성되었다.
