[imjwoo]

📌 PR 개요

새로고침 시 로그인 상태가 풀리는 문제(#51)를 해결하고, AWS 재배포에 맞춰
S3 + CloudFront 배포 대상을 갱신합니다.

🔍 변경 사항

인증 (🐛 fix)

• src/auth/hostedUi.ts
  • buildAuthorizeUrl이 로그인 시 /login을 호출하고 있었으나, Cognito Hosted UI의
    Authorization Code + PKCE 진입점은 /oauth2/authorize입니다. 엔드포인트를 분기하도록 수정
  • 회원가입은 기존대로 /signup 유지
• src/pages/AuthCallbackPage.tsx
  • useRef 가드를 추가해 React StrictMode에서 effect가 두 번 실행될 때
    authorization code 교환이 중복 호출되는 문제 방지
  • 토큰 교환이 성공한 경우에만 홈으로 이동하도록 변경
  • 실패 시 /login으로 강제 리다이렉트하던 동작을 제거하고 화면에 오류를 표시

배포 설정 (🔧 config)

• .github/workflows/s3cloudfront-cd.yml
  • S3_BUCKET을 kickytime-bucket → kickytime-frontend-205366594951로 변경
  • 기존 이름은 S3 글로벌 네임스페이스에서 다른 계정이 선점하고 있어
    현재 계정(205366594951)에서 생성이 불가능했습니다

🏗 함께 진행된 AWS 인프라 변경 (코드 외)

이 PR이 병합되어야 아래 구성이 실제로 동작합니다.

• S3 버킷 kickytime-frontend-205366594951 생성 (퍼블릭 액세스 전면 차단)
• CloudFront 배포 E23NEPCC9F13GF 생성 (d2hk3a4qv3wwww.cloudfront.net)
  • 기본 동작 * → S3 오리진 (OAC)
  • 동작 /api/* → ALB 오리진 (CachingDisabled + AllViewerExceptHostHeader)
  • 오류 페이지 403 → /index.html (200) 로 SPA 라우팅 처리
• GitHub OIDC 자격 증명 공급자 및 kickytime-frontend-deploy-role 생성
• Repository Variables 갱신
  • VITE_API_BASE_URL = /api/ (CloudFront 동일 도메인 상대 경로)
  • VITE_COGNITO_REDIRECT_URI = https://d2hk3a4qv3wwww.cloudfront.net/auth/callback
  • VITE_COGNITO_DOMAIN, VITE_COGNITO_CLIENT_ID 를 현재 사용자 풀 기준으로 교체
• Repository Secrets 갱신 (AWS_DEPLOY_ROLE_ARN, CLOUDFRONT_DISTRIBUTION_ID)

VITE_API_BASE_URL을 상대 경로로 두어 브라우저 기준 same-origin이 되므로
백엔드 CORS 설정과 애플리케이션 코드는 변경하지 않았습니다.

🧪 테스트 방법

1. develop 병합 후 main으로 PR을 올려 병합하면 s3cloudfront-cd.yml이 실행됩니다
2. Actions 로그에서 .env.production 키 목록과 BUILD_DIR=dist 감지를 확인합니다
3. https://d2hk3a4qv3wwww.cloudfront.net 접속 → 메인 화면 렌더링 확인
4. 로그인 버튼 → Cognito Hosted UI로 이동하는지, URL이 /oauth2/authorize인지 확인
5. 로그인 완료 후 /auth/callback에서 홈으로 1회만 이동하는지 확인
   (개발자 도구 Network에서 /oauth2/token 요청이 1건인지 확인)
6. /matches 접속 후 새로고침 → 404 없이 화면이 유지되는지 확인
7. 경기 목록과 사용자 정보가 조회되는지 확인
8. 새로고침 후에도 로그인 상태가 유지되는지 확인 ([BUG] 새로고침 시 로그인 상태가 풀림 #51 해결 여부)

✅ 체크리스트

• 코드가 정상적으로 동작함
• 기존 기능에 문제가 없음
• 코드 컨벤션(Prettier/ESLint)을 통과함
• 필요 시 문서 업데이트 완료
• 관련 이슈에 연결함

📎 참고 이슈

Ref: #51