HTML을 배포했는데 브라우저에 소스가 나왔습니다

들어가며

맥 밖에서도 이모티콘 작업 진행 상황을 보고 싶었습니다. 2026년 9월 3일에 휴대폰용 조회 화면을 만들었습니다. 생성이나 변환은 맥에서 하고, 이 화면에서는 로그인해서 시리즈와 원화만 보도록 했습니다.

HEAD와 GET의 응답이 달랐습니다

처음에는 정적 파일 일곱 개로 시작했습니다. 데이터가 이미 Supabase에 있으니 HTML도 같은 곳에 두면 될 것 같았습니다. Storage에 올려 보고, Edge Function에서도 HTML 응답을 만들어 봤습니다. 브라우저에서는 페이지 대신 태그가 적힌 소스가 나왔습니다.

걸렸던 것은 응답을 확인하는 방법이었습니다. curl -I로 헤더만 요청했을 때는 text/html이 보였습니다. 그런데 실제로 본문을 받는 GET 요청에는 text/plain이 붙었습니다. 브라우저가 받은 응답을 확인해야 했는데, 다른 요청의 헤더를 보고 HTML로 내려간다고 판단했습니다.

지금의 Supabase HTTP 메서드 문서에도 Edge Functions의 HTML 응답은 지원하지 않으며, GET의 text/html을 text/plain으로 바꾼다고 명시되어 있습니다. 함수 안에서 지정한 헤더만으로 브라우저가 받을 형식을 보장할 수 없었습니다.

화면을 옮기고 데이터는 그대로 뒀습니다

HTML은 Cloudflare Pages에 배포하고, 인증과 데이터 조회는 계속 Supabase를 사용하게 했습니다. 시험 삼아 만들었던 Storage 버킷과 함수는 걷었습니다. 배포 스크립트도 파일을 Storage에 올리는 역할에서, 웹 화면이 사용할 설정을 만드는 역할로 바뀌었습니다.

마치며

읽기 전용이라는 말도 범위를 나눠 기록했습니다. 화면에 쓰기 버튼이 없는 것과 데이터 접근 권한이 제한된 것은 별개입니다. 로그아웃 상태에서 조회했을 때 200 []가 돌아오는 것은 확인했지만, 그것만으로 모든 권한 경로를 검증한 것은 아닙니다. 로그인 후 화면 확인도 당시에는 남아 있었습니다.

이 작업에서 휴대폰으로 보고 싶었던 것은 원화와 진행 상태였습니다. 그 작은 화면을 띄우기 전에, 브라우저가 HTML을 받는지부터 다시 확인하게 됐습니다.