TigerCow.Door



안녕하세요. 문범우입니다.

이번 포스팅을 시작으로 해서, 파이썬 기반 웹 프레임워크인 플라스크(Flask)에 대한 기초다지기 강의를 시작할 예정입니다.

해당강의는 서울시립대학교 멋쟁이사자처럼 python 스터디에서 진행되는 강의이며 블로그에 게시되는 내용들은 각 수업을 정리하여 스터디에 참석하지 못한 인원이나 복습용입니다.

(추가로 영상촬영을 생각하고 있지만 아직 실질적인 계획은 없습니다.)


해당 수업은 다음과 같은 분들을 대상으로 진행됩니다.

- HTML, CSS 에 대해서 기본적으로 알고계시는 분들(직접적으로 사용되지는 않습니다.)

- Python에 대해 관심이 있고 흥미가 있으신 분들(문법이 크게 중요시되지 않습니다. 파이썬 문법이 매우 simple하고 쉽기 때문에 중간중간 필요한 것들에 대해서는 설명드릴 예정입니다.)


해당 내용은 기본적으로 파이썬3가 설치되어 있는 기준에서 설명드리며, 맥OS를 기반으로 내용이 진행됩니다.

윈도우와 큰 차이는 없을 것으로 예상되지만 윈도우환경에서 작업하시면서 발생하시는 오류는 댓글 및 이메일을 통해 남겨주시면 빠른 시일내에 답변을 드리도록 하겠습니다.


수업에 대한 커리큘럼 및 강의자료는 아래 github 주소에 있습니다.

https://github.com/doorBW/UOS_LIKELION_python




그럼 바로 강의 내용을 진행해보도록 하겠습니다.



이번강의 내용은 위와 같은 순서로 진행됩니다.

먼저 우리가 다루고자 하는 Flask가 무엇인지 알아볼 텐데, 이에 대해 알기위해 Web Framework가 무엇인지도 매우 간단하게 알아볼 예정입니다.

이후 자신의 컴퓨터에 플라스크를 설치해보고, 기본적인 예제를 진행해보도록 하겠습니다.

이후에는 플라스크를 이용하여 두수의 곱에 대한 값을 구하는 페이지를 만들어보고, 이어서 학교의 공지사항을 크롤링하는 등 플라스크에서 외부 라이브러리를 사용해보는 연습을 해보도록 하겠습니다.


그럼, 플라스크는 과연 무엇일까요?

슬라이드의 그림을 보면, 우리가 과학실험시간에 자주 보던 플라스크..

우리가 지금 배우고자 하는 것과는 전혀 관련이 없습니다 :) ㅎ


플라스크는 쉽게 말해서, 웹 프레임워크(Web Framework) 입니다!

파이썬 기반의 웹 프레임워크로는 플라스크 이외에도 유명한 장고(Django)가 있습니다.

이 두가지에 대한 차이점은 우리가 웹 프레임워크가 무엇인지 먼저 알아보고 확인해볼게요!


웹 프레임워크...가 무엇일까요?

뭔가 자주 들어본 것 같긴한데!

멋쟁이 사자처럼을 하신 분들은 Ruby on Rails를 해보셨을텐데, 이것도 루비언어 기반의 웹 프레임워크입니다.


웹 프레임워크를 너무 어렵게 보지 말고 조금만 더 쉽게 생각해볼게요!


루비온레일즈를 다뤄보신분들은 조금 더 이해가 쉽겠지만, 우리가 웹 어플리케이션, 즉 웹 사이트를 만들때 해야될 것들이 뭐가 있을까요?

보통 처음에 ' http:// main. ~ . com' 이라는 주소로 들어오면 메인 화면을 띄어줄거에요! 그리고 거기서 음.. '게시판' 메뉴를 누르면, 'http:// main. ~ .com/post '이런 정도의 url로 넘어가겠죠!

근데 이런 설정은 누가하죠?

우리가 html에서 a태그를 이용해서 어디로 가는지 알려주죠, 근데 좀더 자세히 들어가서, 게시판에서는 우리가 단지 html로 작성된 내용만 보는게 아니잖아요?

사용자들은 자신이 게시글을 올릴 수도 있어야 하고, 게시글을 확인도 할 수 있어야하고~ 댓글도 달고, 좋아요도 누를수 있어야하죠!

근데 이걸 단순히 html이나 css를 통해서 구현이 가능할까요?


이렇게 우리가 어떤 화면으로 넘어가는지 경로를 설정해주고, 그 경로로 가서 단순히 정보를 보여주는 것 뿐 아니라, 내부적으로 어떤 처리를 할지, 어떤 함수를 실행할지 설정하고, 우리의 데이터베이스에 있는 내용을 어떻게 가져와서 어떻게 보여주게 할 것인지, 우리가 처음부터 하나씩 다~ 구현하려면.. 어떻게 하죠..?


그런데 이를 보다 쉽게 다룰 수 있도록 해주는 것이 바로 Flask이고 웹 프레임워크입니다!


적절한 비유가 될지는 모르겠지만, 제가 청량리에서 신촌으로 무언가 물건을 보내려할때 우리는 '퀵 서비스'를 이용할 수 있어요!

이런 서비스가 없다면, 저는 옷을 차려입고 나가서 집앞 버스정류장에 가서 272, 271 등의 버스를 타고 신촌으로 열심히 가서 알맞은 위치에 물건을 전해줘야 하죠. 하지만 '퀵 서비스'가 있기 때문에, '퀵 서비스'의 이용법만 안다면 아주 간편하게 물건을 전송할 수 있죠! (물론 요금을 지불해야하지만, 웹 프레임워크는 무료랍니다!)


이렇게, 우리가 웹 어플리케이션을 만들고자 하는데 필요한 다양한 설정이나 기능들을 보다 쉽고 간편하게 다룰 수 있도록 해주는 것이 웹 프레임워크입니다.

그리고 세계에 존재하는 다양한 언어별로 사용되는 웹 프레임워크가 여러 종류인 것이죠.

처음에 말씀드렸듯이, 파이썬을 기반으로 한 웹 프레임워크는 대표적으로 플라스크(Flask) 와 장고(Django)가 있습니다.


이 두개의 차이점에 대해서는 쉽게 생각해서,

플라스크는 덜 도와주지만 그만큼 자유도가 높고,

장고는 더 도와주지만 상대적으로 제한된 점이 있어요.


물론 우리와 같이 처음 시작해보는 사람들에게는 두가지 모두 큰차이는 없습니다.

저는 오히려 처음 할때는 깔끔한 플라스크가 조금 더 쉽게 느껴지지 않을까 라는 생각에 플라스크로 수업을 진행하게 되었습니다.



플라스크는 설치도 너무나 간편합니다.

파이썬을 설치하신 분들께서는 pip라는 파이썬 패키지툴이 자동으로 설치되어 있습니다.

이를 통해서 플라스크를 설치하시면 되는데, 위의 슬라이드와 같이


pip install flask


명령어를 맥은 터미널에, 윈도우는 cmd창에 입력시켜주세요!


* 파이썬을 이용하시는 많은 분들께서는 virtualenv 라는 가상환경을 통해 설치하시는 분들도 많은데, 이는 버전관리나 프로젝트 관리가 용이하도록 하는 방법 중에 하나입니다. 물론 이를 익히면 더 좋겠지만, 오히려 처음에는 머리속을 더 복잡하게 할 수 있다고 생각되어 단순히 로컬(자신의 컴퓨터)에 설치하는 과정으로 진행합니다.

이에 대해서 궁금하신 분들은 댓글 및 이메일에 말씀해주시면 답변드리겠습니다. :)


플라스크가 설치가 되었나요?

그럼 자신이 사용하는 에디터를 켜서 위의 코드를 먼저 따라서 쳐볼게요!


다 치셨으면, 이제 한줄씩 무엇을 의미하는지 함께 확인해볼게요.

조금 이따 보겠지만, 위와 같이 9줄 밖에 안되는 코드인데도 불구하고, 이것은 Hello World라는 문구를 출력하는 웹페이지를 완성한 상태입니다 :)


1번줄에서는, Flask라는 패키지, 우리가 방금 설치한 그것에서 flask를 가져옵니다. 쉽게 생각해서 우리가 앞으로 flask를 쓰겠다는 이야기에요.


2번줄에서는 플라스크를 생성(실행?)하는 의미입니다. app이라는 변수에 flask 프로젝트를 초기화 시켜서 실행하겠다라는 코드입니다.


3번줄은 공백이고~ 4번줄에서는, url을 지정해주는 코드입니다.

@app.route('/'), 즉 우리가 위에서 생성한 app에 대해 route, 경로를 설정해줄건데, ('/') http:// <우리 기본 주소> /  와 같은 경로를 이야기해요!

예를 들어, @app.route('/route_test') 라고했다면?

http:// <우리 기본 주소> /route_test 와 같은 경로를 이야기한 것 이겠죠?


그럼, 이렇게 경로를 설정해서 뭐할건데?

그것이바로 다음줄에 나와있습니다.

5번줄에서 함수를 정의하는데, 이것은 바로 위에서 설정한 경로에 사용자가 요청을 보냈을때 실행되는 것 입니다.

hello_world 라는 함수를 실행할 것이고, 그 함수의 내용으로는 6번줄에 나와있습니다.

return 'Hello World!' 단순히 Hello World! 를 반환하도록 하였습니다.

즉 Hello World! 라는 문자열을 띄어주라고 한거에요.


그리고 8,9번줄은 단순히 해당 플라스크 프로젝트를 실행시키는 코드라고 이해하시면 됩니다 :)


이제 위와 같은 구조를 가지는 구구단 계산 페이지를 만들어 볼거에요.

완성된 코드는 github에 있지만.. 일단 우리는 기능적으로 구현되는 것에 초점을 둘것이기에 디자인은 전~혀 예쁘지 않습니다.. :)


(해당 내용은 코드에 따로 주석으로 설명을 달아 놓았으니 추가적인 설명은 생략합니다.)



(해당 내용은 코드에 따로 주석으로 설명을 달아 놓았으니 추가적인 설명은 생략합니다.)




다음주에는 이메일 인증을 통한 회원가입을 구현해보는 실습을 진행할거에요.

실제로 자신의 구글계정을 이용해서 이메일을 보내보도록 하고, 이후에 회원가입 직접 구현해볼거에요!


실제로 비밀번호 암호화도 시켜볼 것이고, 우리가 이메일 보내는 실습을 해냈기 때문에, 회원가입을 요청한 사람이 자신이 등록한 이메일로 전송된 메일로 인증을 성공했을 때만 정상적인 사용자로 인식되게끔 할 예정입니다.


이를 위해서는 데이터베이스를 설치해서 db에 사용자 정보를 담아야하는데, 이때문에 mysql을 연결해볼지 말지 고민중입니다... (거의 할 예정이에요..ㅎㅎㅎㅎㅎ)

하지만 우리가 db 다루는 것이 목표가 아니기 때문에, db에 대해서는 대략대략 넘어가고 우리가 구현하고자 하는 기능을 구현하는데 초점을 둘 예정입니다.



이렇게 첫번째 수업에 대한 사전정리 작업을 하였습니다.

오늘 오후 7시에 수업이 진행되는데, 이후 추가적인 내용은 해당 포스트에 추가하여 정리하겠습니다.

궁금하신 점이나 잘 해결이 안되는 점들은 언제든지 댓글 및 이메일, 카카오톡을 통해 연락해주세요 :)


블로그 이미지

Tigercow.Door

Back-end / Python / Database / AI / Algorithm / DeepLearning / etc

댓글을 달아 주세요


안녕하세요.

오늘은 Tornado web framework를 이용한 Authentication and security를 알아보도록 하겠습니다.

공식문서를 확인하시면  'Authentication and security' 을 주제로한 몇가지 예제가 나와있습니다.

오늘은 그 중 첫번째인 Cookies and secure cookies 에 대해 공부해보겠습니다.


직접적으로 Tornado를 이용하기에 앞서서 먼저 cookie라는 것에 대해 알아볼게요.


1. 쿠키(cookie)란?

쿠키란 특정 웹서버에 대한 접근 정보를 담고 있는 것 입니다.

많은 분들께서 웹브라우저를 이용하시면서 특정 웹사이트가 로그인 정보를 기억한 경험이 있을거에요.

한번 로그인한 웹사이트를 다음에 접속할때는 따로 ID와 password를 입력하지 않아도 자동으로 로그인 되는 상황이죠.


이렇게 로그인 정보를 기억할때 웹 사이트에서 여러분의 로그인 정보를 쿠키(Cookie)로 저장하게 됩니다. 그리고 다음번에 여러분이 해당 사이트에 접근하게되면 해당 쿠키를 통해서 자동으로 로그인이 되도록 하는 것이죠.

순서를 통해 한번 더 이해해보겠습니다.


웹 브라우저  ---------->    웹서버

  1. 요 청


웹 브라우저  <---쿠키----    웹서버

2. 응 답: 쿠키생성 및 저장

3. 웹 브라우저는 쿠키저장소에 쿠키 저장


웹 브라우저  ---쿠키---->    웹서버

4. 쿠키를 통한 요청


웹 브라우저  <----------    웹서버

5. 응답: 받은 쿠키를 이용한 응답



위와 같은 순서로 쿠키가 생성되고 이용된다고 보시면 됩니다.


이러한 쿠키는 클라이언트에 저장된다고 하는데, 쉽게 말해서 사용자의 컴퓨터에 저장된다고 생각하시면 됩니다.

그럼 쿠키에 개인정보나 중요한 정보가 저장되어 있다면 보안상으로 많은 문제를 불러올 수도 있겠죠?

따라서 쿠키에 중요한 정보를 담지 않고 서버에 중요한 정보를 저장하여 이용하는 방지대책도 있으며

쿠키에 저장되는 정보자체를 암호화 하는 방법도 있습니다.


오늘 포스팅에서는 쿠키가 생성되고 저장되는 것을 확인하고,

방지대책으로써 쿠키에 저장되는 정보자체를 암호화시켜보는 과정을 진행해보겠습니다.


2. 쿠키생성

우리는 tornado에서 set_cookie 메소드를 이용하여 쿠키를 생성할 수 있습니다.

이렇게 만들어진 쿠키는 안전하지 않으며 사용자에 의해 쉽게 변경될 수 있습니다.

(보안성 강화는 뒤에서 알아보겠습니다.)


그럼 코드를 직접 작성하여 쿠키가 생성되는 것을 확인해보겠습니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
import tornado.httpserver
import tornado.ioloop
import tornado.web
 
class MainHandler(tornado.web.RequestHandler):     
     def get(self):
          if not self.get_secure_cookie("mycookie"):
               self.set_secure_cookie("mycookie","myvalue")         
               self.write("Your cookie was NOT set yet!")
          else:
               self.write("Your cookie was set!")
               items = ["Item 1""Item 2""Item 3"]                  
               self.render("template_test.html", title="My title", items=items, sayHello=self.sayHello) 
               
     def sayHello(self, name):
          return 'Hello, '+name + '!!!'
 
application = tornado.web.Application([     
     (r"/", MainHandler),   
]) 
 
if __name__ == "__main__":     
     http_server = tornado.httpserver.HTTPServer(application)     
     http_server.listen(8888)     
     tornado.ioloop.IOLoop.instance().start()
cs


지난 번 포스팅에서 진행된 코드에서 수정을 진행하였습니다.

7번 라인을 보시면 현재 사용자가 쿠키를 가지고 있는지 확인합니다.

사용자에게 쿠키가 없다면 8번 라인을 통해 mycookie라는 키(key)와 myvalue라는 정보(value)를 가진 쿠키를 생성하고

9번라인을 통해 화면에는 Your cookie was NOT set yet! 이라는 문구를 띄어줍니다.



그럼 이 화면을 보고 있는 상태라면 이미 8번 라인이 실행된 것이므로 쿠키가 생성되었겠죠?

다시 접속해보면 아래와 같이 화면이 바뀌게 됩니다.


네, 쿠키가 생성되어서 이제 코드 8,9 라인이 진행되지 않고 10번라인부터 진행이 되었습니다.

이제 생성된 쿠키를 확인해볼게요.

웹 콘솔창(Shift + I 을 누른뒤 Console 클릭) 또는 명령어 자체를 주소 창에 입력하시는 것을 통해 확인 할 수 있습니다.

javascript:document.cookie 를 입력합니다.



그럼 좀 전 코드에서 확인한 바와 같이 mycookie 라는 키(key)와 그에 대응하는 myvalue 라는 정보(value)가 생성되어 저장된 것을 확인할 수 있습니다.

하지만 처음에 알아본 것과 같이 이렇게 쿠키가 저장되어 있다면 사용자가 이를 쉽게 수정할 수 있으며 또는 쉽게 정보를 해킹당할 수 있습니다.

예를 들어 특정 웹사이트에서 권한을 1~5로 나누고 A라는 유저는 2 정도의 권한을 가지고 있었는데, 위와 같이 쿠키의 정보가 보안이 되어 있지 않다면 사용자가 2라는 권한을 5로 수정하여 허락되지 않은 행동들을 취할 수 있을 것 입니다.



3. 쿠키 암호화 하기

따라서 우리는 쿠키에 중요한 정보를 저장하지 않거나, 쿠키의 정보 자체를 암호화하는 방법을 이야기했습니다.

그 중 tornado에서는 쿠키의 정보 자체를 암호화 하는 함수를 제공하고 있습니다.

set_secure_cookieget_secure_cookie라는 함수를 제공하고 있으며 이러한 함수들을 사용하기 위해서는 cookie_secret이라는 값을 설정해야 합니다. 

set_secure_cookie를 통해 생선된 인증된 쿠키는 암호화된 정보에 추가적으로 timestamp와 HMAC인증이 저장됩니다. 만약 쿠키가 오래된 것이거나 인증이 맞지 않다면 get_secure_cookieNone값을 리턴하여 쿠키가 존재하지 않는 것처럼 처리하게 됩니다. 

위의 두가지 함수를 이용한 python 코드는 아래와 같습니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
import tornado.httpserver
import tornado.ioloop
import tornado.web
 
class MainHandler(tornado.web.RequestHandler):     
     def get(self):
          if not self.get_secure_cookie("mycookie_2"):
               self.set_secure_cookie("mycookie_2","myvalue")         
               self.write("Your cookie was NOT set yet!")
          else:
               self.write("Your cookie was set!")
               items = ["Item 1""Item 2""Item 3"]                  
               self.render("template_test.html", title="My title", items=items, sayHello=self.sayHello) 
               
     def sayHello(self, name):
          return 'Hello, '+name + '!!!'
 
application = tornado.web.Application([     
     (r"/", MainHandler),   
],cookie_secret="owb4t22n3or$239fn=nefo23/1rf13"
 
if __name__ == "__main__":     
     http_server = tornado.httpserver.HTTPServer(application)     
     http_server.listen(8888)     
     tornado.ioloop.IOLoop.instance().start()
cs


7번 코드를 확인하면 이전과 달리 mycookie_2 가 존재하는지 확인합니다.

그리고 존재하지 않는다면 8번 라인에서 set_secure_cookie 함수를 통해 mycookie_2라는 키와 myvalue 라는 값을 가진 쿠키를 생성합니다. 이후의 동작은 이전의 코드와 동일합니다.

추가적으로 20번라인에 cookie_secret 이 새로 추가된 것을 확인하실 수 있습니다.

저는 해당 cookie_secret을 무작위로 입력하였습니다.

해당 코드로 웹에 접속해 본다면 이전과 같은 결과를 얻을 수 있습니다.

첫 접속에서는, Your cookie was NOT set yet! 이라는 화면이 뜨고 다시 접속하면 필요한 정보들이 출력됩니다.

그럼 다른점을 확인해볼까요?

아까와 같이 웹 콘솔창을 띄우거나 주소창을 통해 이전과 같은 명령어(javascript:document.cookie)를 입력합니다.


그럼 이전에 생성된 mycookie라는 키와 방금 생성된 mycookie_2 라는 키, 두개에 대한 정보를 함꼐 확인하실 수 있습니다.

그 차이점이 명확히 보이시나요?

mycookie_2 라는 키에 대응되는 정보(value)는 암호화되어 사용자가 무슨내용인지 알 수 없습니다.

이런 암호화된 정보를 확인하기 위해서는 위에서 추가한 cookie_secret이 필요할 것 입니다.


토네이도의 공식문서를 통해 확인해보면, 이러한 쿠키는 무결성(integrity)를 보장하지만 기밀성(confidentiality)는 보장하지 않는다고 합니다. 즉, 우리가 쿠키에 대한 정보를 확인할 수 있었듯이 사용자가 쿠키를 볼수는 있지만 수정할 수는 없습니다.

그리고 cookie_secret는 비밀로 유지되어야 하며 이 키의 값을 얻은 사용자는 자신의 쿠키를 생성하거나 수정할 수 있습니다.

기본적으로 tornado의 보안 쿠키는 30일 후에 만료됩니다. 이를 변경하기 위해서는 set_secure_cookie함수에서 expires_days 키워드와 get_secure_cookie의 함수에서 max_age_days 키워드를 수정하면 됩니다.

보다 자세한 정보가 궁금하다면 tornado의 공식문서를 참고하시기를 바랍니다.


이렇게 하여 쿠키(cookie)에 대해 알아보고, Tornado에서 쿠키를 생성하고 보안성을 높이는 방법을 알아보았습니다.

다음에는 유저 인증(User authentication)에 대해서 알아보도록 하겠습니다.

수정되어야 할 점에 대한 피드백이나 문의사항은 덧글 및 이메일(doorbw@outlook.com)을 이용해주세요!

블로그 이미지

Tigercow.Door

Back-end / Python / Database / AI / Algorithm / DeepLearning / etc

댓글을 달아 주세요