사이트가 세상에 공개되는 순간, 당신의 코드는 더 이상 혼자만의 것이 아닙니다.
localhost에서는 아무 문제가 없었던 것들이, 프로덕션에서는 취약점이 됩니다.
“개인 블로그인데 보안까지 신경 써야 해?” — 네, 해야 합니다. 정적 사이트라고 안전한 것이 아닙니다. 이 글에서는 Astro + Vercel 조합에서 배포 후 반드시 확인해야 할 보안 항목들을 정리합니다.
1. 환경 변수 관리 — 코드에 시크릿을 넣지 마세요
가장 흔하고 가장 치명적인 실수입니다.
# ❌ 절대 이렇게 하지 마세요
const API_KEY = "sk-1234567890abcdef";
# ✅ 이렇게 하세요
const API_KEY = import.meta.env.API_KEY;
규칙:
- API 키, 토큰, 비밀번호는
.env파일에 넣기 .env는 반드시.gitignore에 포함 (Astro 기본 설정에 이미 포함되어 있습니다)- Vercel에서는 Settings → Environment Variables에서 설정
- 클라이언트에 노출되어야 하는 변수만
PUBLIC_접두사 사용
# .env
API_KEY=sk-secret-value # 서버에서만 접근 가능
PUBLIC_SITE_URL=https://my.site # 클라이언트에서도 접근 가능
한 번이라도 시크릿이 Git 히스토리에 올라갔다면, 단순히 삭제하는 것으로는 부족합니다.
git filter-branch나 BFG Repo-Cleaner로 히스토리를 정리하고, 해당 키를 즉시 재발급하세요.
2. HTTPS — Vercel이 알아서 해줍니다
Vercel에 커스텀 도메인을 연결하면 Let’s Encrypt SSL 인증서가 자동으로 발급됩니다. 별도 설정이 필요 없습니다. 하지만 확인은 해야 합니다:
- 브라우저 주소창에 🔒 자물쇠 아이콘이 보이는지
http://로 접속했을 때https://로 리다이렉트되는지- 혼합 콘텐츠(Mixed Content) 경고가 없는지
3. HTTP 보안 헤더
정적 사이트라도 응답 헤더에 보안 설정을 추가하면 더 안전합니다. Vercel에서는 vercel.json에서 설정할 수 있습니다.
{
"headers": [
{
"source": "/(.*)",
"headers": [
{
"key": "X-Content-Type-Options",
"value": "nosniff"
},
{
"key": "X-Frame-Options",
"value": "DENY"
},
{
"key": "X-XSS-Protection",
"value": "1; mode=block"
},
{
"key": "Referrer-Policy",
"value": "strict-origin-when-cross-origin"
}
]
}
]
}
각 헤더가 하는 일:
- X-Content-Type-Options: MIME 타입 스니핑 방지
- X-Frame-Options: 클릭재킹 방지 (iframe 삽입 차단)
- X-XSS-Protection: 브라우저의 XSS 필터 활성화
- Referrer-Policy: 외부 링크 클릭 시 전달되는 정보 제한
4. Git 레포지토리 보안
코드가 GitHub에 올라가 있으므로, 레포지토리 자체의 보안도 중요합니다.
필수 설정:
- 2FA(이중 인증) 활성화 — GitHub 계정의 기본입니다
- 레포지토리를 Private으로 설정 (Vercel 배포에는 영향 없음)
- Branch Protection Rules 설정 (혼자 쓰더라도 실수 방지)
- 사용하지 않는 Deploy Key나 Personal Access Token 정리
5. 서드파티 스크립트 주의
Google Analytics, 광고 스크립트 등을 넣을 때:
- 공식 CDN에서만 로드
integrity속성으로 무결성 검증- 꼭 필요한 스크립트만 최소한으로 추가
<script
src="https://example.com/script.js"
integrity="sha384-xxxxx"
crossorigin="anonymous"
></script>
6. 이미지와 에셋 관리
사이트에 올리는 이미지에도 주의가 필요합니다:
- 이미지의 EXIF 데이터에 위치 정보가 포함될 수 있습니다 — 업로드 전 제거하세요
- 사용자가 업로드하는 기능이 있다면 파일 타입 검증 필수
public/폴더의 파일은 누구나 URL로 직접 접근 가능하다는 걸 기억하세요
배포 후 보안 체크리스트
배포할 때마다 이것만 확인하세요:
-
.env파일이.gitignore에 포함되어 있는가? - 코드에 하드코딩된 시크릿이 없는가?
- HTTPS가 정상 동작하는가?
- 보안 헤더가 설정되어 있는가?
- GitHub 2FA가 활성화되어 있는가?
- 불필요한 파일이
public/에 노출되어 있지 않은가?
마치며 — 시리즈를 마무리하며
이 시리즈를 통해 우리는 완전한 빈 화면에서 시작해서 하나의 웹사이트를 세상에 내놓았습니다.
총 비용은 도메인 값 만 원이 전부였습니다. 프레임워크도, 호스팅도, SSL 인증서도 전부 무료. 하지만 그 결과물은 온전히 당신 것입니다.
플랫폼 위의 글은 플랫폼이 사라지면 함께 사라집니다. 내 도메인 위의 글은 내가 지울 때까지 남습니다.
개발자라면 한 번쯤, 자기 이름으로 된 공간을 가져보시길 바랍니다.
그 공간에서 코드를 기록하든, 생각을 기록하든, 실패를 기록하든 — 그건 전부 당신의 자유입니다. 그리고 그 자유가, 직접 만든 사이트가 주는 가장 큰 선물입니다.