v4.0.6: output.css CDN 캐시 무효화 및 nginx CSS 캐시 정책 수정

HTML은 갱신됐으나 구 output.css가 CDN에 남아 Tailwind 레이아웃이 깨지던 문제를 ?v= 쿼리와 CSS must-revalidate로 해결한다.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-06-23 15:57:00 +09:00
parent ba89235207
commit ac1ab7d8c0
9 changed files with 41 additions and 10 deletions

View File

@@ -1 +1 @@
v4.0.5
v4.0.6

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./style/output.css" />
<link rel="stylesheet" href="./style/output.css?v=4.0.6" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Noto+Sans+KR:wght@400;700;900&display=swap" rel="stylesheet" />
<title>관리자 - UNIARE</title>
</head>

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4516420168710424" crossorigin="anonymous"></script>
<link rel="stylesheet" href="./style/output.css" />
<link rel="stylesheet" href="./style/output.css?v=4.0.6" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Noto+Sans+KR:wght@400;700;900&display=swap" rel="stylesheet" />
<title>내 덱 관리 - UNIARE</title>
</head>

View File

@@ -100,7 +100,23 @@ API가 카드 데이터를 메모리에 저장하므로 `datas/` 변경 시 API
### HTML·일반 CSS·프론트 JavaScript 변경
`git pull --ff-only`와 `git lfs pull`을 실행하고 브라우저를 강력 새로고침한다. 컨테이너 재시작은 필요 없다.
NAS는 npm이 없어도 된다. `style/output.css`는 로컬에서 빌드해 Git에 포함되므로 **`git pull`만 하면** 스타일이 반영된다.
```bash
git pull --ff-only
git lfs pull
```
배포 후 확인 (NAS 프로젝트 폴더):
```bash
wc -c style/output.css # 약 55000 (55KB) — 44000대면 구버전, pull 누락
head -1 login.html # output.css?v= 버전 쿼리 포함 여부
```
브라우저에서도 `개발자 도구 → Network → output.css` 크기·상태를 확인한다. Cloudflare를 쓰면 구 CSS가 `immutable`로 남을 수 있어 HTML에 `?v=` 쿼리를 붙인다 (v4.0.6+).
`nginx/default.conf`를 변경했다면 `docker compose -f docker-compose.prod.yml up -d --build uniare-web`으로 웹 컨테이너만 재빌드한다. HTML·`style/`만 바뀐 경우 컨테이너 재시작은 필요 없다.
## 4. 전체 업데이트

View File

@@ -1,5 +1,13 @@
# 업데이트 이력
## 2026-06-23 / v4.0.6 — CSS 캐시·배포 반영 수정
### 수행 작업
- 운영 확인: `login.html`은 갱신됐으나 `output.css`가 구버전(44KB) + CDN 7일 immutable 캐시로 Tailwind 클래스 미적용
- 로그인·회원가입·내 덱·공개 덱·관리자: `output.css?v=4.0.6` 쿼리로 캐시 무효화
- `nginx/default.conf`: CSS는 `must-revalidate` 1시간, JS·이미지는 기존 7일 유지
- NAS 배포 시 `git pull` 후 `wc -c style/output.css`로 약 55KB 확인 (`docs/deploy.md`)
## 2026-06-23 / v4.0.5 — 로그인·덱·관리자 Tailwind 레이아웃 통합
### 수행 작업

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./style/output.css" />
<link rel="stylesheet" href="./style/output.css?v=4.0.6" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Noto+Sans+KR:wght@400;700;900&display=swap" rel="stylesheet" />
<title>로그인 - UNIARE</title>
</head>
@@ -41,7 +41,7 @@
</p>
</main>
<footer class="px-6 pb-5 text-center text-[0.625rem] font-medium tracking-wide text-slate-300" aria-hidden="true">v4.0.5</footer>
<footer class="px-6 pb-5 text-center text-[0.625rem] font-medium tracking-wide text-slate-300" aria-hidden="true">v4.0.6</footer>
<script src="/script/page-i18n.js"></script>
<script src="/script/api.js"></script>

View File

@@ -23,8 +23,15 @@ server {
client_max_body_size 25m;
}
# 정적 자산 캐시
location ~* \.(js|css|png|jpg|jpeg|gif|webp|ico|svg|woff2?)$ {
# CSS — 배포 후 즉시 반영 (immutable 사용 안 함)
location ~* \.css$ {
expires 1h;
add_header Cache-Control "public, must-revalidate";
try_files $uri =404;
}
# 기타 정적 자산
location ~* \.(js|png|jpg|jpeg|gif|webp|ico|svg|woff2?)$ {
expires 7d;
add_header Cache-Control "public, immutable";
try_files $uri =404;

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4516420168710424" crossorigin="anonymous"></script>
<link rel="stylesheet" href="./style/output.css" />
<link rel="stylesheet" href="./style/output.css?v=4.0.6" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Noto+Sans+KR:wght@400;700;900&display=swap" rel="stylesheet" />
<title>공개 덱 - UNIARE</title>
</head>

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./style/output.css" />
<link rel="stylesheet" href="./style/output.css?v=4.0.6" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Noto+Sans+KR:wght@400;700;900&display=swap" rel="stylesheet" />
<title>회원가입 - UNIARE</title>
</head>