본문으로 건너뛰기

프론트 인프라 구조

saju-me 프론트엔드의 배포 런타임과 도메인 구성을 설명합니다.

배포 런타임

Next.js App Router 앱을 Cloudflare Workers 위에서 SSR로 실행합니다.

Next.js (apps/web)
↓ opennextjs-cloudflare build
Cloudflare Worker (.open-next/worker.js)
↓ wrangler deploy
saju-me.com

빌드 도구는 @opennextjs/cloudflare이며, 설정 진입점은 apps/web/open-next.config.ts입니다. 빌드 산출물(.open-next/)은 직접 수정하지 않습니다.

도메인 역할 분리

도메인역할
saju-me.comCloudflare Worker — Next.js SSR
api.saju-me.comNginx HTTPS termination → 백엔드 HTTP

api.saju-me.com은 Cloudflare 뒤에서 Nginx가 HTTPS를 종단하고, 그 뒤에서 백엔드 앱이 HTTP로 동작합니다.

요청 흐름

브라우저
↓ HTTPS
Cloudflare Worker (saju-me.com)
↓ SSR / BFF route.ts
api.saju-me.com (Nginx → 백엔드 HTTP)

브라우저는 항상 saju-me.com Worker와 통신합니다. Worker 내부의 BFF(app/api/**/route.ts)가 api.saju-me.com으로 백엔드를 호출합니다. 클라이언트 컴포넌트에서 백엔드를 직접 호출하지 않습니다.

wrangler.jsonc — source of truth

apps/web/wrangler.jsonc가 Worker 배포 설정의 기준입니다.

{
"name": "saju-me",
"account_id": "클라우드 어카운트 ID",
"main": ".open-next/worker.js",
"compatibility_date": "2026-06-05",
"compatibility_flags": ["nodejs_compat"],
"assets": { "directory": ".open-next/assets", "binding": "ASSETS" },
"routes": [{ "pattern": "saju-me.com", "custom_domain": true }],
"preview_urls": false,
"observability": { "enabled": true, "logs": { "enabled": true } },
"vars": {
"NEXT_PUBLIC_APP_URL": "https://saju-me.com",
"NEXT_PUBLIC_APP_NAME": "SAJU:ME",
"NEXT_PUBLIC_APP_DES": "..."
}
}
경고

Cloudflare 대시보드에서 custom domain, vars, observability를 수정하면 다음 wrangler deploywrangler.jsonc 값으로 덮어써집니다. 설정 변경은 반드시 wrangler.jsonc에 먼저 반영하세요.

환경변수 책임 분리

구분위치예시
Public runtime varswrangler.jsonc > varsNEXT_PUBLIC_APP_URL, NEXT_PUBLIC_APP_NAME
Server secretsCloudflare Dashboard > Variables and SecretsBACKEND_API_BASE_URL, 결제 키
배포 토큰로컬 셸 / GitHub Actions secretCLOUDFLARE_API_TOKEN

CLOUDFLARE_API_TOKEN은 앱 환경변수가 아니라 배포 도구(wrangler)용 인증 수단입니다. .env에 넣어도 되지만 절대 커밋하지 않습니다.

preview URL / workers.dev / custom domain

URL 유형설명
saju-me.com운영 custom domain
saju-me.{account}.workers.devworkers.dev 기본 URL (현재 비활성)
preview URLpreview_urls: false — 비활성

운영은 custom domain만 사용합니다.

SSL/TLS

  • saju-me.com: Cloudflare Edge 인증서를 사용하며, 인증서는 Cloudflare가 자동 관리합니다.
  • api.saju-me.com: Cloudflare를 통해 프록시되며, 브라우저 ↔ Cloudflare 구간은 Edge 인증서를 사용합니다.
  • Cloudflare ↔ Nginx origin 구간은 현재 Full (strict) 모드로 운영합니다.
  • Full (strict) 모드에서는 origin 인증서가 유효해야 하므로, Nginx origin 서버에는 Cloudflare가 신뢰할 수 있는 인증서 또는 Cloudflare Origin Certificate를 유지해야 합니다.
  • Cloudflare의 Always Use HTTPS가 활성화되어 있어 zone의 모든 HTTP 요청은 HTTPS로 리다이렉트됩니다.
  • HTTP → HTTPS 리다이렉트는 Cloudflare에서 담당하므로, origin/Nginx에서 동일한 강제 리다이렉트를 중복 설정하지 않습니다. 중복 설정 시 ERR_TOO_MANY_REDIRECTS가 발생할 수 있습니다.

활성화된 Cloudflare SSL/TLS 옵션

옵션상태비고
Full (strict)EnabledCloudflare ↔ origin HTTPS 연결 및 origin 인증서 검증
Always Use HTTPSEnabledHTTP 요청을 HTTPS로 리다이렉트
TLS 1.3Enabled최신 TLS 프로토콜 사용
Automatic HTTPS RewritesEnabledHTTPS로 제공 가능한 리소스의 http:// 링크를 https://로 자동 변환
Opportunistic EncryptionEnabled암호화 가능한 연결을 활용하는 HTTP/2 성능 최적화