사주 AI 웹서비스 제작노트 - 6

 

사주 AI 웹서비스 제작노트 - 5

 
드디어 찐망고 사주 웹서비스를
지인들과 블로그에 공개했다.
감사하게도 지인분들과 블로그를 통해
유입된 분들까지 포함해
총 13명의 소중한 데이터가 쌓였다
 
https://aistudio.google.com/

대시보드를 보는데
429 TooManyRequests에러는
무료요금제다 보니 분당 요청제한에 걸린 거 같았고
503 에러는 429 에러랑 같이 나타난 것으로 보아
급증한 트래픽때문인듯 ㅋㅋ

 
RPM (Requests Per Minute): 5/5 - 분당요청제한
1분에 최대 5번 까지 호출할 수 있는데 현재 5번 모두 사용 중이라 뜬다 사용자 몰리면 429 에러 뜨는 주범..
RPD (Requests Per Day): 30/20 - 하루요청제한
하루 요청 제한이 20회인데 30회 호출함  이 수치는 보통 UTC기준 0시에 초기화 됨
TRM (Tokens Per Minute): 17.06K/250K - 분당 토큰사용량
오히려 분당 토큰 사용량은 한도에 비해 여유 있었다.
텍스트 분석이라 모델이 과부하는 아닌 듯..

 
주변 지인들 사주가 잘 맞는지 체크하고 업데이트하면서
로그인연동과 결제형태로 넘어가려고 했는데
저 RPM이 너무너무너무 적다 
아무래도 유료전환을 먼저 해야 할 것 같음.
 
DB 안 만들었음 더 난리 났었겠다는 생각이..
 
다행히 본인들 사주는 생각보다 재밌고 잘 맞는다는
긍정적인 반응이 많았고
빨리 궁합이나 재회운 같은 카테고리를
만들어 달라고 했다.
DB를 구축해 둬서 한번 사주를 본 지인들은
다시 본인 사주를 볼 수 있게 처리했더니 좋아한다.
 
피드백을 바탕으로 개선 작업을 할 예정인데
429 에러를 줄이기 위해 예외처리를 만들 예정이고 
로딩바를 만들 예정이다.
로딩이 길다 보니 클릭을 여러 번 하는 경우가 생기는 듯
그리고 사주결과값이 나오면 스크롤을 아래로 살짝 내려서 보이게 처리해야 할 듯싶다. 
한자만 나오는 만세력인데 한글표기를 추가해 달래서
적극 반영 예정
 

사주 웹서비스 이미지

 
코드 수정

// 1. 할당량 초과(429) 체크
if (res.status === 429) {
    setErrorMessage("현재 무료 사용량이 소진되었습니다. 내일 다시 시도해주세요! 🥭");
    setLoading(false); 
    return; 
}

// 2. 기타 서버 에러 체크
if (!res.ok) {
	throw new Error("서버 응답 오류");
}

const dataRes = await res.json();

// 3. 정상 데이터 처리
if (dataRes.candidates?.[0]?.content?.parts?.[0]?.text) {
	setResult(dataRes.candidates[0].content.parts[0].text);
} else {
	throw new Error("데이터 형식이 올바르지 않습니다.");
}

} catch (e) {
    console.error("발생한 에러:", e);    
    // 이미 위에서(429 체크 등) 에러 메시지를 설정했다면 그대로 두고,
    // 메시지가 비어있을 때만(진짜 네트워크 장애 등) 아래 메시지를 보여줌
    if (!errorMessage) {
      setErrorMessage("현재 접속자가 많거나 네트워크가 원활하지 않습니다. 잠시 후 다시 시도해주세요🥭");
    }
} finally {
    // 4. 어떤 상황에서도 로딩은 꺼야 함!
    setLoading(false); 
}

 
로딩바 화면을 추가했다
바이브코딩하다 보니 피그마도 안 키고 작업하는 중인데
이래도 되나 싶다. 예전에 로딩바 만드는 예제 가지고
한 시간도 수업 가능했는데
한 시간이 뭐야 반나절도 가능한데..
1분 걸림

로딩바 화면 추가

 
SEO를 등록해 볼까나! 이건 다음 포스팅에.