TIL

22.09.19~ 22.09.22 미니 프로젝트 회고

DoosanBaek 2022. 9. 22. 22:05

미니 프로젝트 진행 기간 : 2022년 9월 19일 오전 11시 ~ 2022년 9월 22일 오후 6시

프로젝트 명 : 북적북적

프로젝트 인원 : 3명

프로젝트에 사용한 언어 : 파이썬, 자바스크립트

프로젝트 환경 : 파이참(PyCharm) IDE 사용하여 프로젝트 생성, python 가상환경 구성

데이터베이스 : NoSQL( 몽고DB Atlas 클라우드 데이터베이스 이용 )

배포 환경: AWS -EC2를 이용한 서버 배포

추가한 라이브러리

bcrypt==4.0.0
cachelib==0.9.0
colorama==0.4.5
Flask==1.1.2
Flask-PyMongo==2.3.0
Jinja2==3.1.2
MarkupSafe==2.1.1
numpy==1.23.2
PyJWT==2.4.0
pymongo==4.2.0
six==1.16.0
Werkzeug==2.2.2

 

주요기능 구현 방식

 - 로그인 : JWT 토큰 인증방식 , 정규표현식 유효성체크 

 - 독후감 : 웹스크래핑 , CRUD(Create,Read,Update,Delete)

 - 프로필 유저 : 모달팝업, 생성 , 수정, 이미지변경 , 이미지 파일업로드

-  유저 댓글 : 모달팝업 생성, 댓글 생성

 - 좋아요 하트 :  1) 누가 2) 어떤 포스트에 3) 어떤 반응 남겼는지 세 정보 넣고 db 저장

                           좋아요인지, 취소인지 따라 해당 도큐먼트 insert_one() 할지, delete_one()을 할지 결정(삼항연산자 이용) 

 - 서울시 도서추천 : 서울시 책방 공공 API 사용 , Xml 형식 데이터 Json 변경                     

트러블슈팅 내용

1. 독후감 페이지 
문제점 : 수정박스와 삭제박스가 작동하지 않았다.

(1)원인  : num값을 담을 공간을 선언하지 않았다.
     해결  ->  넘값을 담을 공간을 만들어주고 수정과 삭제부분에 넘이 빠져있는 부분을 찾아 채워줌

(2)원인 :  수정박스와 삭제박스를 지목하지 않았다.
     해결  ->   디브박스를 만들어 수정과 삭제를 지목하여 열어줌 

(3)원인 : 독후감 박스에서 내용 수정 후, 저장하는 app.py post 요청 부분에서 doc 파일에 num 값을 저장하지 않고   
               db에 저장하여 num 값이 저장되지 않았다. 
    해결 ->  저장할때 num 값을 넣어서 db에 num값이 들어가도록 해결했다.

(4)원인  : list(db.books.find({}, {'_id':False}))   books db에서 꺼내어  books_list로 저장하고 books_list 를 len함수로 길이를 count로 세서 
              다큐먼트에   doc = { 'num' : count  }  count 한 num 값을 db.books.insert_one(doc) 하여 books db에 저장했는데, 이때 
              len(book_list) 에 +1 을 하지 않아서 num값이 이상하게 노출 되었다.
    해결 ->  len 함수를 이용해서 book_list의 길이를 구하고 거기에 1을 더해서 저장해서 num값이 1씩증가하여 db에 저장되도록 해결했다.
 
(5)원인   독후감 박스 수정 박스에 append를 사용하여 temp_html를 붙이는 과정에서 수정박스를 제이쿼리를 사용해 append를 붙였는데, 
             이때 #을 붙이지 않고 $('edit-box').append(temp_html) 로 작성하는 오타 실수로 오류가 발생했는데 #을 붙여서 
     해결  -> $('#edit-box').append(temp_html)로 만들어 제이쿼리 형식을 정상적으로 사용해 id 값을 불러오자 해결되었다.


2. 로그인 페이지
문제점: 배포 후 로컬에서는 작동되는 로그인 기능이 작동되지 않았다.
(1)원인 : 로컬에서 실행하는 몽고 db 계정 주소와 실제 aws 배포후에 연결되는 몽고 db 계정주소를 구별하지 않았다. 
(2)원인 : aws 인스턴스 생성후 , 파일질러에서 파일을 옮길때 ubuntu 서버에 설치되지 않은 라이브러리 파일이 있는 파일이 들어갔다.
       (결국 해결하지 못한 상태) 

3. navbar 적용 index.html 페이지
문제점: navbar 연결후 연결된 html 페이지 화면이 깨지는 문제
(1)원인 :  app.py  에서 보내는 경로를 잘못 적어서 화면이 깨지는 문제였다. 
    해결 : @app.route('/') 경로 수정후 navbar 선택시 정상적으로 화면이 노출되었다. 

4. user.html 
유저 프로필의 기본 사진이 노출되지 않는 문제 
원인 :  profile_pics 경로에 profile_placeholder.png 파일을 넣지 않아 문제 발생 
해결 : 경로에 맞게 기본 사진파일을 넣어주고,  파일명과 경로를 정확하게 작성하여 해결되었다. 

5. 로그아웃 되지 않는 문제
로그아웃 구현시 로그아웃 버튼을 눌러 로그아웃 함수를 탔음에도 로그아웃되지 않는 문제 발생 
원인 : 쿠키에서 토큰을 지워주는 함수를 작성하지 않고 window.location.href ="/loin" 으로 로그인 경로로 보낼려고 해서 문제 발생 
해결 : $.removeCookie('mytoken', {path: '/'}); 를 작성해서 jquery에서 토큰을 지워주는 함수 사용하여 로그아웃이 되도록 해결

6. 회원가입시 password가 암호화 되지 않고 그대로 db에 저장되는 현상 
원인 : 회원가입시 password를 hashlib 라이브러리를 이용해서 암호화 하는 내용이 없어 비밀번호가 암호화 되지않는 문제 발생 
해결 :   function sign_up() 함수에서 input에 들어온 username , password, password2 를 조건문으로 유효성 검사를 지나게하고,
            얼럿 노출없이 통과한 password 값을 password_give에 받아서 보내면, ajax 로 /sign_up/save 경로로 post 요청을 했다. 
            app.py에서 @app.route('/sign_up/save 경로 post 요청 부분으로 값이 오게되고 
            이때 password_give로 받은 값을 password_receive에 담고 
            hashlib.sha256으로 password_receive를 인코딩해서 password_hash에 담아 doc에 넣고 users db로 insert 해서 해결했다. 
  
7. 회원가입 구현시 로그인 안되는 문제현상
문제점: 회원가입 구현시 hash 함수로 password를 암호화 하는 encoding 과정을 거치자 로그인 안되는 문제 발생
원인 : hash함수로 암호화된 password를 decode 하는 내용이 app.py 로그인 @app.route('/' ) 경로에서 jwt token을 decode 하는 부분에서 
          오류가 발생하여 payload = jwt.decode(token_receive, SECRET_KEY ,algorithms=['HS256']  에서 payload에 담기는 값이 문제가 생겨           
          오류발생.
해결 : token_receive 값과 SECRET_KEY 값, 해쉬함수로 암호화된 값에 decode로 감싸서 암호를 푸는 디코딩 과정을 넣고 이것을 jwt로   
       이름붙여 payload에 넣어서 오류 해결.