🚀 예상 구조

[1] 앱(Expo React Native)

- 카메라 작동 시작
- 일정 주기(예: 1초)에 한 번씩 프레임 캡처
- -> socket.emit('frame', { image: 캡처된 이미지 데이터 }) 보내기
(보통 base64 인코딩하거나, 작은 사이즈로 resize 후 전송)

[2] 서버(FastAPI + socketio)

- 'frame' 이벤트 수신
- 받은 이미지 데이터를 AI 모델에 입력
- AI 모델이 Brix 당도 예측 수행

[3] 서버 → 앱

- 예측 결과(예: { brix: 13.5 })를
- socket.emit('prediction', { brix: 13.5 }) 로 클라이언트에게 보내줌

[4] 앱

- socket.on('prediction', callback)으로 결과 수신
- 화면에 바로 예측 결과 표시 (ex: 화면 위에 당도 수치 띄우기)
- 다음 프레임 계속 캡처 및 반복

React Native는 socket.io-client FastAPI에서는 fastapi-socketio

이유 :

✨ 한 줄 요약

Expo에서는 localhost 말고, ngrok이나 cloudflared로 외부 주소를 열어야 WebSocket 연결이 확실하게 됩니다.

<프론트 소켓 실행 터미널>

cloudflared tunnel --url http://localhost:8000

→ 터미널에서 cloudflared 서버 주소 가져와서 server_url 에 삽입.. (지금은 수동으로 하고 있는데 자동으로 하는 법이 있을 것(서칭 전))

→ npx expo start — tunnel

✅ 요약하면:
지금은 Cloudflare Quick Tunnel로 개발하고, -> 계속 수동으로 빌드할 때마다 주소 변경
나중에 실제 배포 서버가 생기면 도메인을 등록해서 고정 주소로 전환하면 됩니다.

<백엔드 소켓 실행 터미널>