Flutter와 백엔드 연결하기

이은서·2024년 8월 22일

Flutter

목록 보기
2/3
post-thumbnail

프로젝트에서 사용될 포인트들에 맞춰서 다룰 예정이다.

1. 백엔드 API 설계 및 구현

Next.js는 서버 사이드 렌더링(SSR)정적 사이트 생성(SSG)을 지원한다. Next.js는 서버 역할을 하며 Flutter 앱이 요청할 API를 제공한다.

API 엔드포인트

이미지 업로드 및 분석 요청

(1) 사용자가 Flutter 앱에서 촬영한 아기 변 사진을 업로드
(2) 이미지는 서버로 전송되어, 이후 ChatGPT-4 API와 연동되어 분석이 진행된다.

건강 상태 결과 제공

분석된 결과를 Flutter 앱에 전달한다.

2. Flutter 앱에서 HTTP 요청

Flutter 앱은 사용자가 촬영한 이미지를 서버로 전송하기 위해 HTTP POST 요청을 보낸다. Flutter에서 http 패키지를 사용하여 이미지를 multipart/form-data 형식으로 전송하고, 서버에서 처리된 결과를 수신한다.

3. 이미지 촬영 및 업로드 UI 구성

Flutter에서는 사용자가 이미지를 촬영하고 이를 서버에 업로드할 수 있는 UI를 제공한다.
이를 위해 카메라 기능을 사용할 수 있는 패키지(e.g: image_picker)를 활용할 수 있다.

4. 백엔드 응답 처리 및 결과 표시

Flutter 앱은 백엔드에서 받은 분석 결과를 UI에 표시한다.

0개의 댓글