1.
파이썬 플라스크로 만드는 간단
넥스타그램 서버
v1.0

2.
학습목표
이 학습을 마치면…
- 파이썬 개발 환경을 갖추는 방법을 알 수 있습니다.(OSX 기준)
!
- MySql설치, 관리를 할 수 있습니다.(OSX 기준)
!
- 플라스크를 이용하여 서버를 생성할 수 있습니다.
!
- 외주를 하는 간접 경험을 할 수 있을지도?! <- 이번 컨셉

3.
각자 서버가 있으면 좋겠지만…
http://sinsip.com/medium/ts.png
없다고 가정하고
!
OSX기준으로
로컬에 파이썬 플라스크와 MySql을 설치를 합니다.
또 직접 제작중에 부분부분 자료를 만들은 탓에
삽질에 의해 결과적으로 불필요한 작업이 포함되어있을수 있습니다.

4.
이런 외주 의뢰가 들어왔습니다!
기존에 서비스를 운영하던 N모사!
!
PHP로만든 서버가 있는데
재개발 의뢰가 들어왔습니다.
(이유는 상상에…)
!
하지만 이때까지 웹 프레임워크는 만져보지 못해봤지만
파이썬 플라스크가 간단하고 성능도 간단히 쓰는 정도에는 좋다고 하여
!
플라스크를 이용하여 개발을 하고자 합니다.

5.
서버로부터 게시글의 정보를
json 형태로 불러오던 형태
http://upload.wikimedia.org/wikipedia/commons/a/ac/Nexus_5_Front_View.png

6.
플라스크로 데이터를 처리하고
DB는 MySql을 사용하려 합니다.
http://upload.wikimedia.org/wikipedia/commons/a/ac/Nexus_5_Front_View.png

7.
먼저 MySql설치…
http://dev.mysql.com/downloads/mysql/

8.
설치에 시간이 소요 되므로
잠시 다른 설치를 하겠습니다.

9.
pip 설치
https://pip.pypa.io/en/latest/installing.html
get-pip.py 를 다운로드합니다.

10.
sudo python get-pip.py

11.
pip란?
python의 패키지를 자동으로 관리해주고
설치를 도와주는 툴입니다.
!
필요한 패키지가 있으면
sudo pip install <package>만으로
자동 다운로드에서 설치까지 됩니다.

12.
flask 설치
http://flask.pocoo.org/
sudo pip install Flask
pip가 있으면 한줄로 설치 가능…

13.
시스템 환경설정에서
MySql을 선택하여
MySql을 실행합니다.

14.
mysql - python 설치
export PATH=$PATH:/usr/local/mysql/bin/
sudo pip install MySQL-python
sudo pip install flask-mysql
sudo ln -s /usr/local/mysql/lib/libmysqlclient.18.dylib /usr/lib/

15.
MySql설정

16.
MySql 접속
cd /usr/local/mysql/bin
sudo ./mysql
아직 root password가 설정되어있지 않아
바로 접속이 가능합니다.

17.
root 비밀번호 설정
use mysql;
update user set password=password('사용하고 싶은 패스워드') where
user='root';
flush privileges;
quit

18.
./mysql -u root -p
create database nextagram;
use nextagram;
<-비밀번호 입력
mysql 접속 후 데이터베이스 생성

19.
여기까지가 밑준비…

20.
본격 외주 체험하기
!
전 개발자가 다음의 문서를 남기고 떠났습니다.
http://goo.gl/ldIkZw

21.
전에 사용하던 DB 정보와…
왜 varchar인지는 그냥 귀차니즘….의 잔재

22.
요청내역과 쿼리문

23.
기존의 소스코드도 포함되어있습니다…

24.
굉장히 보기 불편하고 허전해보이지만
이마저도 없고 사장님은 컴맹인 일도 있습니다…
http://pds.joins.com/news/component/moneytoday/201111/28/2011112814508246454_2.jpg

25.
문서에 있던 대로 새 테이블을 만들어 주었습니다…
(원래라면 기존 DB가 있거나 덤프떠서 옮기는 작업이 필요합니다.)

26.
그리고 테스트용 임시 데이터를 넣어봤습니다…
(나중에 삭제해야합니다!)
insert into next_android_nextagram (Title, Writer, Id, Content, WriteDate, ImgName) values
('title1', 'writer1', 'id1', 'content1', 'writeDate1', 'imgName1');
!
insert into next_android_nextagram (Title, Writer, Id, Content, WriteDate, ImgName) values
('title2', 'writer2', 'id2', 'content2', 'writeDate2', 'imgName2');

27.
Flask HelloWorld

28.
HelloWorld
예제의 에디터는 sublime사용… 편하신것 사용하시면 됩니다…

29.
HelloWorld
http://127.0.0.1:5009/

30.
python main.py(파일명)

31.
만약 already use에러가 나오면…

32.
만약 already use에러가 나오면…
다른 프로세스에서 해당 포트를 사용중이거나
비정상 종료로 인해 소켓이 대기중인 상태…

33.
ps 로 프로세스 정보를 본다음
해당하는 애들을
kill <PID>로 종료합니다.
!
그래도 안되면… 포트를 변경해서 실습합시다…

34.
사실 플라스크에서는 html을 템플릿을 사용해 표시해주거나 하는데…
이 실습에서는 굳이 프런트를 보여줄 필요가 없으므로 생략합니다…

35.
만들어야 되는 것
http://server:port/loadData <- DB의 게시글 정보를 Json으로 표시
http://server:port/upload <- 사진 업로드와 게시글 정보 DB저장
http://server:port/image/asd.jpg <- 업로드 되어있는 사진 접근

36.
만들어야 되는 것
http://server:port/loadData <- DB의 게시글 정보를 Json으로 표시
http://server:port/upload <- 사진 업로드와 게시글 정보 DB저장
http://server:port/image/asd.jpg <- 업로드 되어있는 사진 접근

37.
먼저 MySql과 연동해보겠습니다.

38.
/loadData로 경로를 하나 추가하고…

39.
쿼리를 실행하고 그 결과를 print해보았습니다.
하지만 지금 출력 결과는 list에 tuple형태… json형태로 출력해야합니다.

40.
기본 제공되어 있는 json을 불러오고

41.
json.dump를 사용해 json형태로 변환하고
웹페이지에 띄울수 있도록 리턴하였습니다.

42.
결과가 잘 나온듯 하지만 뭔가 이상합니다…

43.
값만 있고 키가 없어서
실제로 사용하기에는 문제가 있습니다.
http://jsonviewer.stack.hu/

44.
커서의 description을 먼저 가져와
데이터를 가져올때마다 하니씩 합쳤습니다.

45.
정상적으로 출력하고 있는것을 확인하실 수 있습니다.

46.
만들어야 되는 것
http://server:port/loadData <- DB의 게시글 정보를 Json으로 표시
http://server:port/upload <- 사진 업로드와 게시글 정보 DB저장
http://server:port/image/asd.jpg <- 업로드 되어있는 사진 접근

47.
문서에 따르면 업로드는 POST방식으로 넘어옵니다.
request method에 post일때만 처리를 해줄려고 합니다.

48.
하지만 이제부터 테스트의 지옥…
스마트폰으로 계속 업로드 시도를 해야 합니다…
(기존 php서버로 정상적으로 전송하는지 체크해보는것도 좋을 수 있습니다.)
http://www.fhm.nl/upload/content/image/Thomas/Augustus%202013/artwork/4/12.jpg

49.
클라이언트가 post form으로 게시글 정보를 보내오므로
다음과 같이 데이터를 받아서 확인해 봅니다.
!
여기서 문제가 발생하면 다시 한번 처음부터 원인 검토를…

50.
간단히 클라이언트 없이
테스트를 해볼려면?

51.
파일 업로드

52.
이미지들을 보관할 폴더를 만들었습니다.

53.
그리고 그 폴더의 경로를 따로 지정해 놨습니다…
( 파이썬에 대해 흥미가 생기신 분은 자동으로 경로를 가져오도록 해보세요^^ (os라이브러리 이용) )

54.
파일 저장을 위해 os를 불러왔습니다.

55.
문서와 클라 코드를 보니 upload’ed’file이라는
이름으로 전송이 이루어지고 있습니다…

56.
tip1
가끔 보면 서버사이드 파일인 jsp나 php파일을 업로드시도가 있습니다.
이런 경우에는 꼭 서버쪽에서 검증이 필요합니다.
헤더 분석도 좋지만 간단히 확장자만이라도 확인하면 좋습니다.
(폴더의 실행 권한도 없애고…)

57.
save()로 업로드된 파일을 저장합니다.

58.
파일이 잘 저장되는것을 확인할 수 있습니다.
( 안되면 다시 원인 검토…)

59.
이제 DB에 넣어보겠습니다.
insert에는 commit()이 꼭 필요 합니다.
쿼리가 길어서 처리…

60.
DB에도 잘 들어갔습니다.
(안되었으면 다시 검토…)

61.
리스트를 정상적으로 받아왔지만
사진을 가져오지 못하고 있습니다.
!
(위에 두개는 처음 테스트로 입력한
데이터여서 사진이 없음…)

62.
만들어야 되는 것
http://server:port/loadData <- DB의 게시글 정보를 Json으로 표시
http://server:port/upload <- 사진 업로드와 게시글 정보 DB저장
http://server:port/image/asd.jpg <- 업로드 되어있는 사진 접근

63.
이미지 파일을 요청하면 이미지를 리턴하는것을 만들어 보겠습니다.

64.
리턴에 send_file(경로) 끝…

65.
이미지 요청이 성공적으로 이루어졌습니다.

66.
truncate table next_android_nextagram;
로 DB를 날리고
!
앱도 지운후에 다시 해보면
성공적으로 잘 표시됩니다.
!
(만약 안되시면 또…
디버깅의 연속…)