항해99 미니프로젝트

Chan·2022년 11월 17일
0

항해99

목록 보기
6/6
post-thumbnail

11월 14일 월요일 Pre-Onboarding주차가 끝나고 실제 1주차가 되었다
아침 9시에 출석체크 하는데 이럴수가..
조장이다.............

이번 주차는 미니프로젝트 기간이다
일단 조별로 모여서 기획회의를 진행했다

주제는 러닝 커뮤니티

https://proground.co.kr/

해당 어플을 모티브로 기획회의를 진행했다

회의 내용은 페이지 구성, 구현할 작업, 통일해야 할 색상, 페이지 구성 이미지(간단히) 등이다.
내가 맡은 페이지는 커뮤니티 페이지이다

일단 내가 맡은 부분은 #6 식당 메뉴판 만들기 에처럼 카테고리를 만들어주고 버튼을 눌렀을 때 해당 카테고리 별로 보여주기를 진행했다.

처음에는 버튼을 눌렀을 때 섹션에 보이긴 하는데 전체 페이지에서도 나눠져서 보였다
아직 TIL은 올리지 않았지만(6-1로 올릴 예정) forEach()를 사용하여 나눠서 각각 리뷰를 올리는 순서대로 붙여지게 하고 카테고리 별로 나눴다


오류

일단 진행은 순조롭게 잘 되다가 github에 올릴 때 merge에서 충돌이 있었다
조원분들이 나 포함 4명이었는데 github 협업은 다들 처음이라 어려운 부분이 있었다
나도 혼자서 github를 써보기는 했지만 협업은 처음이라
repo를 새로 생성하고 거기 안에 venv, app.py, static, templates를 미리 넣어놨어야 했던 것 같다
페이지가 다 각각이라 html은 충돌하는 것이 없었는데 .idea에 있는 내용들과 app.py가 충돌했다
그래서 우회적으로 조원분들 한분씩 app.py의 파일명을 1,2,3,4로 변경하고 다시 merge하였다
그래서 일단 github 사용 오류는 일단락 되긴 했다
근데 중요한건 내가 사용하는 파이참에서는 파이썬 버전이 3.10이여서 내꺼를 올리면 왠지 잘못될 것 같은 느낌..
일단 한분꺼로 작업하기로 하고 진행했다
pull 작업할 때 오류가 발행했는데

git stash
git pull

을 진행하니까 해결되었다

전체적으로 잘 진행되었고 배포환경까지는 순조롭게 잘 진행되었다
사실 설레발쳤다.. 너무 쉽게 봤던거지... 큰코다치지..
배포 잘되면 내일은 하루 푹 쉴까요? 했는데
그말 하지말걸...^^
못해도 4~5시간동안 해결못하고 끙끙거렸던 것 같다
결국 해결하긴 했지만 배포 후 로그인 문제가 진행되지 않았다
다른 페이지는 다 들어가지지만 들어가지는 페이지에 id값이 지정되지 않아서 다른 페이지는 무리없이 들어가진 것 같다

해결 방법

일단 오류가 어디서 나는지 확인해야 했다
console.log, print를 하나하나 끊어 진행하면서
매니저님과 함께 오류가 나는 부분을 찾았다
로그인 버튼을 눌렀을 때 POST http://ip주소/api/login 500 오류가 났다
일단 서버쪽에서 오류가 나는 것 같다
보통 500 오류는 서버쪽 과부하, 소스코드 등이 있는데
우리는 login할 때만 안되는 것을 보니 소스코드가 문제겠지..
비밀번호를 틀리게 입력했을 때도 잘 진행되고 회원가입도 잘 진행되었다
login버튼을 눌렀을 때 터미널에

TypeError: Object of type bytes is not JSON serializable

해당 오류는 구글링을 통해 해결했다

https://kibua20.tistory.com/69
참고한 사이트

로컬 환경에서는 로그인이 잘 진행되서 token값에 아무거나 지정해주고
token을 출력했더니

b'ejewljl233lkr23'

로 출력되는 것을 확인할 수 있었다
참고한 사이트 설명을 보면

Dictionary를 JSON으로 변환하기 위해서는 일반적으로 string으로 직렬화하여 전달해야 하지만, 직렬화가 정의되지 않은 byte array 로 전달하여 Type error 에러가 발생하는 것입니다. decode('utf8') 함수를 사용해서 byte array를 string으로 변환하여 수정할 수 있습니다.
에러 메시지는 dictionary 타입의 payload가 byte array를 포함하고 있어, 이를 JSON으로 변환(=직렬화, serialize)하는 과정에서 Type error가 발생한 것이다.
base64.urlsafe_b64encode(message.as_bytes()의 return 값은 byte array이고, JSON 변환을 위해서는 string 으로 변환해야 한다.
json.dumps()함수는 일반 obj를 JSON 포맷의 string으로 serialize 한다

이 문서를 처음 읽었을 때는 왜 이얘기를 하는 지 몰랐는데
매니저님과 함께 트러블 슈팅시 token값을 출력할 때 값이 b'token'으로 나온 것을 보고
token값에 .decode()
문서를 다시 보고 해결을 진행했다

호기롭게 성공했다고 생각했지만 다음 문제가 기다리고 있었다.
이유는 아직 모르겠는데 로그인을 진행할 때 로그인 성공 alert이 진행 되는데
로그인이 유지가 되지 않았다.

콘솔에 login버튼을 누른 상태로 response를 출력했을 때 나오는 이미지 예시이다

쿠키가 어떻게 저장되었는지 확인했는데 쿠키값이 %22token값%22로 저장이 되었다
그래서 위에 이미지 예시 사진을 자세히 보았더니 ""가 중간에 더 있었다
...그래서 String으로 저장 되었기 때문에 token 값을 slice() 해주어야 했다
처음에 slice()를 어디에 붙여야 할지 몰라서 python에다 붙였다가
생각해보니까 JavaScript 메서드인데 파이썬에 붙여놓고 안된다고 하고 있었다..

그래서 index파일로 가서 response에

response['token'].slice(1, -1)

을 해주었다.
역시나... 잘된다 ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ
약 6시간 만에 해결했다

이제 시작이겠지...
아직 고칠 부분이 너무 많고 github사용도 제대로 할 줄 알아야 할 것 같다
JSON, BSON 파일 공부도 해야하고 로그인 관련 보안문제도 공부해야한다

그리고 아직 못 알아본게 Restful한 Api작성 방법..
좀있으면 발표해야하는데 더 알아봐야해...
화이팅...

profile
드디어 신발 신은 프론트엔드 개발자

0개의 댓글