본문 바로가기

과정/2차 AI프로젝트 서비스 개발5

프로젝트 '재움' 개발과정(5) chatGPT api를 이용하여 GPT에게 정보를 주고 수면 피드백을 받아보겠습니다! 먼저 open api key를 이용해 사용하여야 하는데요 gpt 3.5 turbo를 사용하였습니다. 서버에서 전달받은 데이터를 토대로(chatGPT를 이용할 때 직접 쓰는 질문이랑 같습니다.) 답변을 해줄겁니다. gpt에게 어떤 데이터를 넘겨줄 것인지 정하겠습니다. start_sleep : 수면 시작 시간 total_sleep : 총 수면 시간 sleep_event : 수면 자세 bad_position_time : 바르지 않은 수면 자세 시간 을 넘겨주도록 하겠습니다. 촬영 종료 버튼을 누르면 바로 피드백을 받을 것이기 때문에 버튼을 눌렀을 때 gpt에게 질문을 던져줘야 합니다. 아래 엔드포인트를 통해 닉네임과 수면정보.. 2023. 11. 7.
프로젝트 '재움' 개발과정(4) 안녕하세요! 오늘은 실시간으로 캡처된 이미지에 라벨을 달고 자세가 3번 연속 바뀌었을 때 데이터베이스에 수면이벤트가 저장되도록 해보겠습니다. 먼저 record.js에 함수를 추가해주겠습니다. 이전에 작성하지 않았던 captureAndUploadFrame 함수입니다. // 이미지 업로드 함수 function captureAndUploadFrame() { // HTML 요소를 동적으로 생성합니다. 이 캔버스는 이미지를 그리기 위한 렌더링 대상이 됩니다. const canvas = document.createElement("canvas"); // 캔버스 크기 설정 canvas.width = videoElement.videoWidth; canvas.height = videoElement.videoHeight; .. 2023. 10. 31.
프로젝트 '재움' 개발과정(3) 안녕하세요! 오늘은 촬영정보를 넣어보는 시간을 가지도록 해보겠습니다. 그전에 먼저 html파일을 css로 꾸며보도록 하겠습니다. home.html 재움 사용자를 생성하거나 기존 사용자로 로그인하세요. 새로운 사용자 생성 촬영페이지로 home.css body { font-family: Arial, sans-serif; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; } .container { max-width: 400px; background-color: #fff; padding: 20px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-r.. 2023. 10. 23.
프로젝트 '재움' 개발과정(2) 안녕하세요! 오늘은 닉네임을 생성하고 데이터베이스에 넣어보는 거를 해보겠습니다. 먼저 데이터베이스를 연결해주어야 하는데요.(MySQL을 사용하는 전제입니다.) database.py from sqlalchemy import create_engine, text from sqlalchemy.ext.declarative import declarative_base from sqlalchemy.orm import sessionmaker DATABASE_URL = "mysql://{}:{}@{}:{}/{}?charset=utf8mb4".format("[mysql_id]", "[mysql_pw]","127.0.0.1",3306,"[database_name]") # 엔진생성 engine = create_engine( D.. 2023. 10. 21.
프로젝트 '재움' 개발과정(1) 안녕하세요! 얼마 전 프로젝트 '재움'의 개발을 시작했습니다. 웹페이지에서 웹캠으로 실시간으로 영상을 촬영하는데 10초에 한 번씩 캡처를 하여 저의 로컬 폴더에 저장하도록 해보겠습니다. 로그인 회원가입 서비스는 개발 마지막에 적용할 것이기 때문에 사용자를 구별하기 위해 닉네임으로 임의 대체하였습니다. record.html 촬영 종료 이제 촬영버튼을 누르면 웹캠이 실행되도록 javaScript코드를 작성해 줍니다. 1. 촬영버튼을 누르면 웹캠이 실행되고 10초마다 한 번씩 캡처한 이미지를 서버로 보내줍니다. 2. 종료버튼을 누르면 웹캠이 종료됩니다. record.js // HTML 문서에서 camera id를 가진 비디오 요소를 가져옵니다. const videoElement = document.getEle.. 2023. 10. 19.