QR 코드를통한간편로그인 2018. 11. 7 지도교수 : 이병천교수님 4 조 Security-M 지승우이승용박종범백진이
목 차
조원편성
주제선정 비밀번호가뭐였지? 이런일없이조금더쉽게로그인할수있는방법은없을까?
주제선정 ID와패스워드에의한로그인방식의획기적인변화필요 문자형 ID와패스워드 QR Code 등활용 간편한타겟인식및암기식보안체계의불편극복 인증방식의간소화로다양한분야에서활용가능 QR Code 를활용한간편로그인기술및 SSO(Single Sign On) 연구개발 Laravel Framework 기반웹어플리케이션개발 QR Code 사용자인증방식개발 최초의인증으로여러응용프로그램의로그인처리가능
추진일정 구분 기간 (2018 년 ) ( 단위 : 월 ) 3 4 5 6 7 8 9 10 11 주제선정및계획수립 QR 생성및인식구현 서버및웹페이지구축 QR 인증로그인, SSO 구현 시스템통합및결과종합
구상도 1. QR Code 발급요청 2. QR Code 발급 웹서버 인증서버 로그인된디바이스 5. SSO 인증서버에서 Token 값확인 3. QR Code 인식 ( 인증요청 ) 4. 인증요청 비로그인디바이스 6. 로그인제공
개발환경및시스템구축 (1/11) 개발환경 서버및 DB APM(Apache, PHP, MySQL) 웹서비스 Laravel 5.4 Framework, Chrome Extension 웹호스팅 Naver Cloud Platform Ubuntu Server
개발환경및시스템구축 (2/11) 웹서버구축 : Apache 설치 Apache 설치 Apt-get install apache2 Apache 구동 Service apache2 start Apache 정상구동
개발환경및시스템구축 (3/11) 웹서버구축 : PHP 설치 PHP 및모듈설치 Apt-get install php7.0* Apache 재시작 Service apache2 restart PHP 정상구동
개발환경및시스템구축 (4/11) DB 구축 : MySQL 설치 MySQL 설치자 포트번호, 패스워드등설정 mysql u root p 패스워드입력
개발환경및시스템구축 (5/11) Laravel 프레임워크설치 (1/3) 선정이유 솔루션 (QR Code) 개발편의성 패스워드암호화에최적화된 Bcrypt 사용 Composer 사용으로편리함 최근관심도급증 Bcrypt 암호화 - 패스워드암호화목적으로설계 - 강력한 Hash 매커니즘중하나 - PHP 5.5 버전부터내장함수화 Laravel CodeIgniter Yii Symfony Phalcon
개발환경및시스템구축 (6/11) Laravel 프레임워크설치 (2/3) Composer 설치 의존성관리와 Laravel 설치를위해 Composer 사용 Composer 설치 다운 / 설치 (https://getcomposer.org) php 경로확인 설치후화면
개발환경및시스템구축 (7/11) Laravel 프레임워크설치 (3/3) Laravel 설치 Composer로 Laravel 설치 php artisan serve 명령어로구동 Localhost 로구동시첫화면
개발환경및시스템구축 (8/11) QR Code : 생성 public function QrAutoGenerate(Request $request) Bcrypt로 1회성패스워드생성 { $result=0; $baseqr=0; if ($request->action = 'updateqr') { $user = Sentinel::getUser(); if ($user) { $qrlogin=bcrypt($user->personal_number.$user->email.str_random(40)); $user->qrpassword= $qrlogin; $user->update(); $result=1;} } <div class=" text-center"> @if(sentinel::getuser()->qrpassword) <img src="data:image/png;base64, {!! base64_encode(qrcode::format('png')->color(38, 38, 38, 0.85)->backgroundColor(255, 255, 255, 0.82)->size(200)- >generate(sentinel::getuser()->qrpassword))!!} "> <p> 당신의 QR code 위와같습니다.</p> @endif 1 회용토큰값을 Base64 이미지인코딩
개발환경및시스템구축 (9/11) QR Code : 생성 @section('scripts') 30초마다 QR Code 갱신 <script> //Delete Items var sum = 0; $(document).ready(function(){ settimeout("qr_timer()", 30000); // 30000ms(30초 ) 가경과하면 qr_timer() 함수를실행 }); function qr_timer(){ $.ajax({ type: "POST", cache: false, url : "{{action('qrlogincontroller@qrautogenerate')}}", data: {action:'updateqr'}, success: function(data) { if (data==1) { location.reload(); }else{ alert( 'Ups error :P '); }}})} 유출시발생되는위험을미연에방지
개발환경및시스템구축 (10/11) SSO(Single Sign On) 한번의인증과정으로여러사이트나서비스를이용할수있는체계 단일계정로그인또는단일인증이라고도부른다.
개발환경및시스템구축 (11/11) SSO 작업 : 토큰생성및검증 protected function generatesessionid($brokerid, $token) { SSO 서버에서토큰생성 $broker = $this->getbrokerinfo($brokerid); if (!isset($broker)) return null; return "SSO-{$brokerId}-{$token}-". hash('sha256', 'session'. $token. $broker['secret']); } public function construct($url, $broker, $secret, $cookie_lifetime = 3600) { if (!$url) throw new \InvalidArgumentException("SSO server URL Error"); if (!$broker) throw new \InvalidArgumentException("SSO broker id Error"); if (!$secret) throw new \InvalidArgumentException("SSO broker secret Error"); $this->url = $url; 서버에 SSO id, passwd 등록 $this->broker = $broker; $this->secret = $secret; $this->cookie_lifetime = $cookie_lifetime; } 서버 URL, ID, SECRET 중하나라도오류시에러코드발생
개발결과및시스템운영 (1/7) SSO : 서버접속 크롬확장프로그램 라라벨프레임워크 같은계정으로여러개의서비스에로그인가능
개발결과및시스템운영 (2/7) 메인화면 ID/PASSWD 로그인, QR code 로그인, 등록
개발결과및시스템운영 (3/7) 등록및로그인 등록 -> 로그인 -> QR Code 확인 QR Code 확인 Login QR Login Code 후확인화면가능
개발결과및시스템운영 (4/7) QR Code : 로그인 QrLogin Click QR Code 로로그인해도 ID, PASSWD 와동일하게로그인가능
개발결과및시스템운영 (5/7) QR Code : Mobile 로그인 Moblie Qr Click 카메라 ( 전면 / 후면 ) 선택가능
개발결과및시스템운영 (6/7) QR Code : 갱신 유출및도용방지를위한 QR Code 갱신 Click! 30 초마다새로운 QR Code 로갱신
개발결과및시스템운영 (7/7) QR Code : 갱신 QR Code 변경시예전 QR Code 로는사용이절대불가 재발급 만료된 QR Code 사용시에러메시지출력
결론및기대효과 결론 QR Code 를통해로그인간소화및번거로움감소 중앙집중적인사용자관리가가능하고, 단일 ID와 PW만사용함으로써 SSO의유용성입증 기대효과 QR Code 스캔을통한결제시스템구현가능 인증서, ISP 결제대체가능 출입통제등의다양한방면에서활용가능
감사합니다