없는 글과 CSS가 200으로 열린다: Nginx try_files 진단 순서

잘못된 글 주소를 열었는데 홈 화면이 나온다. CSS 요청은 200인데 화면은 깨진다. 상태 코드만 확인하면 둘 다 성공처럼 보이지만, 요청한 콘텐츠를 받은 것은 아니다. 정적 블로그에서 마지막 fallback이 무엇을 반환하는지 확인하는 방법을 살펴본다.

같은 파일에 두 가지 마지막 처리 방식을 적용했다

최초 실험에서는 home-v1이라는 본문을 가진 index.html을 만들고, 없는 경로를 404로 끝내는 설정과 홈 파일로 넘기는 설정을 비교했다. 아래 코드는 server 블록 안의 경로 처리 부분이며 완전한 Nginx 설정은 아니다.

location / {
    try_files $uri $uri/ =404;
}
location /fallback/ {
    try_files $uri /index.html;
}

try_files는 지정한 후보를 확인하고 마지막 인자로 다음 처리 방식을 정한다. 이 실험의 /fallback/에서 파일을 찾지 못하면 /index.html로 내부 이동해 홈 본문을 받았다. 브라우저 주소가 홈 주소로 바뀌는 301 리디렉션과는 다르다.

없는 CSS도 홈 HTML로 돌아왔다

9월 22일 KST 보강 실험에서는 article.html을 추가하고 글과 자산 경로를 나눠 요청했다. 정상 글은 article-v1을 반환했다. 엄격한 경로의 없는 글과 CSS는 404였고, fallback 경로의 두 요청은 모두 200과 home-v1이었다.

CSS라는 확장자의 URL을 요청했다는 사실이 응답도 CSS임을 보장하지 않았다. 이 결과에서는 브라우저 렌더링 오류를 측정하지 않았지만, 자산 요청에 홈 본문이 돌아오는 잘못된 전달은 HTTP 응답만으로 확인할 수 있었다.

내 사이트에서는 세 주소의 헤더와 본문을 보관한다

# example.com과 경로를 자신의 사이트·실제 글로 바꾼다.
curl -sS --connect-timeout 3 --max-time 10 \
  -D known.headers -o known.html https://example.com/notes/existing/
curl -sS --connect-timeout 3 --max-time 10 \
  -D missing.headers -o missing.html https://example.com/check-missing-article/
curl -sS --connect-timeout 3 --max-time 10 \
  -D asset.headers -o asset.body https://example.com/assets/check-missing.css

이 명령은 본문을 버리지 않고 파일로 저장한다. -L을 사용하지 않아 이동 응답이 있으면 첫 상태와 Location을 먼저 읽을 수 있다. 404를 정상적인 진단 결과로 보므로 --fail도 넣지 않았다. curl의 종료 코드 0과 HTTP 200은 같은 의미가 아니다. 요청이 끝나면 헤더 첫 줄과 저장한 본문을 함께 확인한다.

정적 사이트와 SPA는 마지막 처리를 다르게 판단한다

URL마다 HTML 파일이 있는 정적 사이트는 파일이 없을 때 실제 404로 끝내는 구성이 맞을 수 있다. 반면 브라우저 라우터가 화면 경로를 해석하는 SPA는 유효한 앱 경로에 공통 HTML을 제공해야 할 수 있다. SPA의 공통 HTML 반환 자체를 오류로 단정하지 말고, 누가 경로를 해석하는지와 앱이 없는 경로를 어떻게 처리하는지를 구분한다.

API와 CSS·이미지 같은 자산은 앱 화면의 경로와 같은 규칙으로 처리해도 되는지 따로 판단한다. 이 글은 실제 SPA를 실행한 실험이 아니므로 특정 프레임워크의 최종 오류 처리나 검색 수집 결과까지 보장하지 않는다.

수정 후 정상 글·없는 글·자산을 다시 검사한다

수정 후 통과 조건을 주소별로 적어 둡니다. 정상 글은 200과 기대한 글 본문, 없는 글은 404와 오류 문서, 정상 CSS는 200과 CSS 본문이어야 합니다. 없는 CSS는 홈 문서와 200으로 바꾸지 않습니다. 친절한 HTML 오류 화면을 쓰더라도 상태가 404이면 ‘오류 화면이 예쁘다’와 ‘존재하는 자원이다’를 혼동하지 않을 수 있습니다. 상태·Content-Type·본문 중 하나만 검사하면 이번 fallback 실험의 잘못된 응답을 놓칠 수 있습니다.

• Nginx 설정 검사부터 반영 확인까지: nginx -t 성공 뒤에도 볼 것

  설정을 반영하기 전 후보 검사와 반영 후 응답 확인을 묶는다.

• 파일을 덮어쓰지 않고 정적 사이트의 배포 위치 바꾸기

  배포 직후 이전 HTML이 참조하는 CSS의 누락을 확인한다.

python3 run-lab.py --output observations.json

python3 lab-nginx-candidate-routes.py --output new-observations.json