사주결 + 자미두수 + AI 해석

정적 웹앱(index.html) + AI 해석용 서버리스 함수(api/interpret.js)로 구성된 프로젝트입니다. 사주팔자·자미두수 계산은 전부 브라우저에서 실행되고, "AI 종합 해석" 기능만 서버(백엔드)를 거칩니다.

폴더 구조

webapp/
  index.html        프론트엔드 전체 (계산 로직 + UI, 별도 빌드 과정 없음)
  api/
    interpret.js     AI 해석 API (Vercel 서버리스 함수)
  package.json
  .env.example       필요한 환경변수 예시

1. 로컬에서 확인하기

index.html은 그냥 브라우저로 열어도 계산 기능은 다 동작합니다 (AI 해석 버튼만 서버가 없으면 에러 메시지가 뜹니다). AI 해석까지 로컬에서 테스트하려면 Vercel CLI를 쓰는 게 제일 간단해요.

npm i -g vercel
cd webapp
vercel dev

실행 후 안내되는 로컬 주소(보통 http://localhost:3000)로 접속하면 /api/interpret까지 함께 동작합니다. 이때도 .env.local 파일에 OPENAI_API_KEY를 넣어둬야 합니다 (아래 3번 참고).

2. 배포하기 (Vercel 기준)

1. https://vercel.com 가입 (GitHub 계정으로 로그인 가능)
2. 이 webapp 폴더를 GitHub 저장소로 올리기
3. Vercel에서 "Add New Project" → 방금 만든 저장소 선택 → 그대로 Deploy (프레임워크 설정 없이도 정적 파일 + api/ 폴더를 자동으로 인식합니다)
4. 배포가 끝나면 https://프로젝트이름.vercel.app 주소가 생깁니다.
5. 커스텀 도메인을 쓰고 싶다면 Vercel 프로젝트 설정 > Domains 에서 보유한 도메인을 연결하세요.

3. AI 해석 기능 켜기 (환경변수 설정)

Vercel 프로젝트 > Settings > Environment Variables 에 아래를 추가합니다.

이름	값	필수
OPENAI_API_KEY	https://platform.openai.com/api-keys 에서 발급받은 키 (sk-...)	예
OPENAI_MODEL	사용할 모델 ID (비워두면 gpt-4o-mini 사용)	아니오

환경변수를 추가한 뒤에는 **다시 배포(Redeploy)**해야 반영됩니다.

API 키는 절대 index.html이나 프론트엔드 코드에 직접 넣지 마세요. 브라우저에 노출되는 순간 누구나 그 키로 당신의 계정에 요금을 발생시킬 수 있습니다. 반드시 api/interpret.js처럼 서버(함수) 쪽에서만 사용해야 합니다.

4. 결제 연동 (아직 미완성 — 실제 서비스 전 필수)

지금 앱의 "AI 해석 보기" 버튼은 테스트용 모의(mock) 결제로 동작합니다. index.html 안의 mockPayBtn 클릭 핸들러(주석에 TODO 표시됨)를 실제 결제 SDK 연동 코드로 바꾸면 됩니다.

추천 순서

1. PG(결제대행)사 선택: 토스페이먼츠 또는 포트원(구 아임포트) 추천 — 카드/카카오페이/네이버페이를 한 번에 지원합니다.
2. 사업자등록: 온라인으로 유상 서비스를 판매하려면 사업자등록(개인사업자도 가능)이 필요합니다. 관할 세무서 또는 홈택스에서 신청.
3. 통신판매업 신고: 전자상거래로 재화/서비스를 판매하므로 관할 구청에 통신판매업 신고가 필요합니다 (정기결제·소액이면 면제되는 경우도 있으니 PG사 가이드 확인).
4. PG사 가맹 계약: 사업자등록증 등 서류를 제출하고 심사를 받습니다. 승인까지 보통 며칠12주 소요됩니다.
5. 결제 SDK 연동: PG사에서 제공하는 JS SDK로 결제창을 띄우고, 결제 성공 시 서버에서 결제 검증(webhook) 후 AI 해석 API 호출을 허용하도록 구현합니다.
   • 지금 구조에서는 결제 성공 콜백 안에서 runAiInterpretation()을 호출하는 지점(mockPayBtn 핸들러)만 교체하면 프론트는 크게 안 바뀝니다.
   • 다만 지금처럼 프론트에서만 "결제완료" 플래그를 다루면 우회 결제가 가능하므로, 실제 서비스에서는 서버가 결제 성공 여부를 직접 확인한 뒤에만 /api/interpret이 응답하도록 바꿔야 합니다 (예: 결제 성공 시 서버가 1회용 토큰을 발급하고, /api/interpret 호출 시 그 토큰을 검증).

5. 비용 관련 참고

• Vercel: 개인/소규모 트래픽은 무료 티어로 충분합니다.
• OpenAI API: 사용한 토큰만큼 과금됩니다. gpt-4o-mini 기준 해석 1건당 비용은 매우 저렴한 편(1건에 몇 원~수십 원 수준)이지만, 트래픽이 늘면 누적되니 건당 결제 가격 책정 시 감안하세요. 더 높은 품질이 필요하면 gpt-4o로 바꿀 수 있지만 비용이 올라갑니다.
• 같은 생년월일시로 반복 요청이 들어올 걸 대비해, 필요하면 결과를 DB(예: Supabase)에 캐싱해서 같은 사주는 API를 다시 부르지 않도록 최적화할 수 있습니다 (아직 미구현).

6. 지금 상태 요약

• 사주팔자 계산 (진태양시/서머타임/절기 보정)
• 자미두수 명반 계산
• AI 해석 백엔드 API (api/interpret.js) — 배포 후 API 키만 넣으면 동작
• 결제 플로우 UI 골격 (모의 결제)
• 실제 PG 연동
• 서버 측 결제 검증 (현재는 프론트 플래그만 있어 우회 가능한 상태)
• 사용자 계정/결제 내역 저장 (필요해지면 Supabase 등 DB 추가 고려)