http://ec2-3-38-109-64.ap-northeast-2.compute.amazonaws.com/

사용자의 얼굴 이미지를 분석해 닮은 십이지신을 알려주는 서비스

• Main Feature: 사용자가 업로드한 이미지를 AI가 분석해 닮은 동물 정보를 제공
• Additional Feature: 운세 제공

Main	Login
비회원, 회원을 선택하여 진행할 수 있습니다	회원로그인을 선택한 페이지입니다.

Signup	Upload the Image
회원가입 페이지 입니다.	사진을 업로드 하시면 AI가 사진을 분석합니다.

The results of Zoodiac	Fortune page
AI가 분석한 상위 3개의 결과를 그림과 함께 보여줍니다.	참여한 유저들의 그림과 함께 선택했던 단어의 유사도를 기준으로 순위를 매겨 보여줍니다.

Mypage	Ranking page
로그인한 계정들로 분석한 결과를 전부 확인 할 수 있습니다.	참여한 유저들의 분석 결과를 유사도를 기준으로 순위를 매겨 보여줍니다.

• / 　　　　　 → Startpage
• /Signinpage → Login page
• /Signuppage →Signuppage
• /Mainpage → upload your image
• /Resultpage → show your result
• /Rankpage → show rank
• /Intropage → tell the fortune

• api/v1/users/
  • GET : 회원가입 시 아이디, 닉네임 중복 체크 결과
  • POST : 회원 가입 정보 저장
• api/v1/users/auth
  • POST : access token, refresh token 갱신

• api/v1/animals/animalist
  • GET : 모든 십이지신 운세 정보
• api/v1/animals/rank
  • GET : 가장 십이지신과 닮은 사람들의 랭킹 (기간 : 일주일)
• api/v1/animals/user/{user_id}
  • POST : 사용자가 업로드한 사진 분석하는 task id
• api/v1/animals/user/{user_id}/tasks/{task_id}
  • POST : task id을 이용한 사진 분석 결과
• api/v1/animals/user/{user_id}/mypage
  • GET : 사용자가 올린 사진들에 대한 정보

• DataSet : crawling at Google with Selenium, OpenCV
• Training Teachable Machine with Google

Frontend	Backend	AI	DevOps	Etc

• clone the repository

$ git clone https://github.com/sungnam-team-b/docker.git
$ git submodule foreach git pull origin main
$ git submodule update
delete docker-compoes.yaml at backend folder
$ cd docker

• docker compose build and up

$ docker-compose up --build

$ cd docker/frontend
$ npm start
$ cd ../backend/backend
$  python manage.py runserver

• used_library

  • djangorestframework-jwt

• JWT_Settings.py

  • set JWT’s default_settings

    

• JWT on frontEND

  • 리덕스를 활용하여 refresh token과 access token을 보관합니다.
  • 사용자의 정보가 필요하면 데이터베이스에 조회하지 않고 access token을 이용하여 사용자의 정보를 파악합니다.

• JWT on backEND

  • 요청이 들어오면 토큰으로 해당 유저가 맞는지 확인해주고 그에 맞는 응답을 해줍니다.
  • refresh token을 추가로 활용하여 보안을 강화하였습니다.

• exporter가 매트릭을 수집하고 HTTP 통신을 통해 metric data를 가져갈 수 있게 /metrics 라는 HTTP 엔드포인트를 제공한다. 그러면 Prometheus server가 이 exporter의 엔드포인트에 HTTP GET 요청을 이용하여 metric data를 pull 한다.
• 해당 노드의 metric data

• Prometheus의 시각화 도구가 부족하여 이를 직접 사용하지는 않고 대게 Grafana라는 Data Visualization tool을 이용하여 시각화하고 있다.

Requests / Request Latency / Responses / Response Status

#Members of Team-B