AI가 쓴 코드를 게시해도 안전할까요? 키, .env 파일, 그리고 무엇이 공개되는지

한눈에 보기

게시한 모든 파일은 사이트를 열 수 있는 누구나 읽을 수 있고, 비밀번호가 있어도 그 점은 달라지지 않아요. 키, 비밀번호, 고객 데이터는 올리지 마세요.
서버가 없다고 위험이 없는 것은 아니에요. 붙여넣은 키, 외부 스크립트, innerHTML로 넣은 텍스트를 주의하세요.
키가 유출되면 먼저 폐기하세요. 파일을 삭제하는 것만으로는 충분하지 않아요.

공개되는 것

꼭 기억해야 할 규칙이 하나 있어요. 웹사이트를 게시하면 그 안의 모든 파일을 주소를 아는 누구나 내려받을 수 있어요. 어떤 페이지도 링크하지 않은 파일도 마찬가지예요. 코드를 “난독화”하거나 “압축”해서 숨겨도 읽기 어려워질 뿐 비밀이 되지는 않아요.

파일 종류	공개 여부	예시
HTML, CSS, JavaScript	가능	`script.js`에 직접 입력한 API 키
이미지, PDF, 다운로드 파일	가능	어떤 페이지도 링크하지 않은 가격표 PDF
설정 파일	가능	토큰이 들어 있는 `config.json`
`.env` 파일	네, 업로드하면 공개돼요	프로젝트 옆에 보관한 키
소스 맵(`.map`)	네, 업로드하면 공개돼요	원본 코드를 읽을 수 있는 사본
`.git` 폴더	네, 업로드하면 공개돼요	“삭제된” 키가 남아 있는 예전 기록
게시하지 않은 파일	불가	메모, 초안, 프로젝트의 나머지 부분

비밀 키가 숨는 곳

AI 도구는 무언가를 작동하게 만드는 데 능숙해요. 가끔은 키를 코드에 그대로 붙여넣는 것이 가장 빠른 방법이기도 해요. 이런 것들을 찾아보세요.

JavaScript 속 키. 페이지에서 AI 서비스를 직접 호출하는 챗봇 위젯에 키가 코드로 들어 있는 경우. 누구나 그 키를 복사해 요금을 폭탄으로 만들 수 있어요.
.env 파일. 프로젝트는 키를 .env라는 파일에 보관해요. 내 컴퓨터에만 있어야 하지만, 프로젝트 폴더 전체를 게시하면 함께 업로드돼요.
설정 및 빌드 파일. 설정 파일, 소스 맵, 남은 테스트 파일에 공유할 생각이 없던 키나 경로가 들어 있을 수 있어요.
.git 폴더. 이 숨김 폴더에는 오래전에 “삭제된” 키까지 포함해 프로젝트의 전체 기록이 들어 있어요.

공개 키는 괜찮아요

웹 페이지에 있어도 되도록 설계된 키도 있어요. Stripe 게시 가능 키(pk_...), 내 도메인으로 제한한 지도 키, 분석 ID 같은 거예요. 키를 브라우저에서 써도 안전한지는 해당 서비스 문서에 나와 있어요. “비밀” 또는 “서버 전용”이라고 되어 있거나 sk_로 시작한다면 절대 사이트에 넣으면 안 돼요.

기능에 비밀이 필요하다면

어떤 기능이 비밀 키가 있어야만 작동한다면, 일반 웹사이트는 혼자서 그것을 안전하게 처리할 수 없어요. 선택지는 이래요.

그 일을 위해 만들어진 서비스를 쓰세요. 문의 양식에는 양식 서비스, 상담에는 예약 도구, 결제에는 호스팅된 결제 페이지. 비밀은 그 서비스가 대신 보관해요.
비밀 정보를 작은 서버 함수 뒤에 두고, 페이지는 그 함수를 호출하게 하세요. 이를 지원하는 서비스가 필요해요.
지금은 그 기능을 빼세요. 분명한 이메일 링크가 유출된 키보다 나아요.

AI에게 직접 물어보세요. “이 사이트에 비밀 키가 들어 있어? 있다면 브라우저에 비밀을 넣지 않고 어떻게 할 수 있어?” 물어보면 대개 문제를 찾아내요.

다른 곳에서 불러오는 스크립트

AI가 만든 페이지는 다른 웹사이트의 스크립트를 불러오는 경우가 많아요. 글꼴 로더, 아이콘 팩, 분석, 채팅 위젯 같은 것들이에요. 각각은 내 페이지에서 모든 권한으로 실행돼요. 방문자가 입력하는 것을 읽고 화면에 보이는 것을 바꿀 수 있어요. 그 다른 사이트가 해킹당하면 내 페이지도 해킹당해요.

적게 쓰세요. 이렇게 물어보세요. “이 페이지에 외부 스크립트가 정말 하나하나 필요해?”
버전을 고정하세요. “latest” 대신 library@1.2.3를 써서 파일이 모르는 사이에 바뀌지 않게 하세요.
라이브러리가 제공한다면 무결성 검사를 추가하세요. 그러면 브라우저가 변조된 파일을 거부해요. 이렇게 생겼어요.

무결성 검사가 있는 스크립트

<script src="https://cdn.example.com/lib@1.2.3/lib.min.js" integrity="sha384-..." crossorigin="anonymous"></script>

위젯을 확인하세요. 분석, 채팅, 예약 위젯은 쿠키와 추적도 추가하는 경우가 많아요. 각각이 무엇을 하는지 알고 개인정보 페이지에 밝히세요.

페이지에 텍스트를 안전하게 넣기

주소창, 양식 입력칸, 방문자에게서 받은 텍스트를 innerHTML로 페이지에 넣으면, 공격자가 다른 사람의 브라우저에서 실행되는 코드를 끼워 넣을 수 있어요. 이를 크로스 사이트 스크립팅, 즉 XSS라고 해요. 안전한 습관은 코드로 실행되지 않는 textContent로 일반 텍스트를 넣는 거예요.

안전하지 않은 텍스트 처리 찾기

Find every use of innerHTML, document.write and eval in my site. For each one, say where the text comes from. If it can come from the URL, a form or a visitor, change it to use textContent instead. Tell me what you changed.

내 페이지의 챗봇

AI와 대화하는 채팅창은 AI 서비스를 호출할 키가 필요해요. 그 키는 서버에 있어야 하고, 내 페이지에는 절대 있으면 안 돼요. 알아 둘 점이 두 가지 더 있어요.

프롬프트 인젝션. 방문자가 봇을 속여 내 지시를 무시하게 만드는 지시를 입력할 수 있어요. 이를 완전히 막을 수는 없어요.
그러니 피해를 줄이세요. 봇에게 비밀도 권한도 주지 마세요. 공개된 텍스트로 질문에만 답한다면 속임수가 큰 해를 끼치기 어려워요.

양식과 개인 정보

필요한 것만 받으세요. 이름과 이메일이면 충분한 경우가 많아요. 필드가 하나 늘 때마다 지켜야 할 것이 하나 늘어요.
어디로 가는지 밝히세요. 개인정보 페이지에 누가 메시지를 받고 왜 받는지 적으세요.
저장소를 직접 만들지 마세요. 일반 페이지는 메시지를 안전하게 저장할 수 없어요. 양식 서비스나 호스트에 내장된 것을 쓰세요.

Page Lemon에서는 AI에게 “내 사이트에 문의 양식을 추가해 줘”라고 요청하세요. 메시지는 이메일로 오고 계정에도 저장되며, 별도의 양식 서비스는 필요 없어요. 양식은 유료 요금제에 포함돼요. 문의 양식을 참고하세요.

라이선스와 정확성

라이선스를 확인하세요. 외부 라이브러리, 글꼴, 아이콘, 이미지에는 조건이 있어요. 출처 표기가 필요한 것도 있고 상업적 사용을 금지하는 것도 있어요. 사용한 것과 출처를 목록으로 만들어 달라고 AI에게 요청하세요.
사실을 확인하세요. AI는 가격, 후기, 주장을 지어낼 수 있어요. 게시하는 사람은 바로 나예요.
AI가 쓴 작업의 소유권은 국가에 따라 다르고 아직 정리되는 중이에요. 법률 조언이 아니에요. 중요하다면 전문가에게 물어보세요.

AI에 붙여넣으면 안 되는 것

사이트는 공개되지만 채팅은 공개용이 아니에요. 채팅에는 이런 것을 붙여넣지 마세요.

고객 목록, 주문, 메시지. AI 서비스가 그 데이터를 어떻게 다루는지 아는 경우는 예외예요.
비밀번호, API 키, 로그인 코드. AI가 사이트에 그대로 써 넣을 수 있어요.
전단지에 인쇄하지 못할 내용은 모두.

만드는 동안에는 임시 이름과 “example@example.com”을 쓰세요. 실제 정보는 직접 바꿔 넣으세요.

링크를 공유하기 전 5분 점검

하나씩 체크하세요. 아니면 훑어보는 일은 아래 프롬프트로 AI에게 맡기세요.

6개 중 0개 완료

프로젝트가 아니라 결과물을 게시하세요. 빌드 단계가 있다면 빌드가 만든 폴더(보통 dist 또는 build)를 게시하세요. 없다면 사이트에 필요한 것만 담은 새 폴더를 만드세요.
숨김 파일을 찾아보세요. Mac에서는 Finder에서 Cmd+Shift+.를 누르고, Windows에서는 “숨긴 항목”을 켜세요. .env, .git와 알아볼 수 없는 것은 모두 지우세요.
키를 검색하세요. 폴더에서 key, secret, token, sk_를 검색하세요. 일치하는 항목을 모두 확인하세요.
외부 스크립트를 정리하세요. 다른 사이트에서 불러오는 스크립트를 모두 파악하고 꼭 필요한 것만 남기세요.
방문자에게 보이는 것을 확인하세요. 직접 해야 해요 게시된 사이트를 열고 “소스 보기”로 불러오는 파일을 훑어보세요.
개인 정보를 확인하세요. 직접 해야 해요 테스트 데이터, 실제 고객 이름, 개인 전화번호를 지우세요.

읽기 전용 점검

List every external script, key-like string, innerHTML use, form action and personal detail in my site, with the file and line for each. Don't change anything.

이것이 깨끗하면 웹사이트 공개 체크리스트를 살펴보세요.

키가 공개돼 버렸다면

Page Lemon이 돕는 방법

AI로 만든 사이트는 이런 문제를 생각해 본 적 없는 사람들이 게시하는 경우가 많아서, 몇 가지 안전장치를 두었어요.

.env 파일, .git, node_modules, 소스 맵, 개인 키 파일은 건너뛰고 절대 제공하지 않아요.
업로드한 파일에서 잘 알려진 종류의 비밀 키와 개인 키를 검사해요. 발견되면 그 업로드는 아무것도 게시되지 않고, 어느 파일의 몇 번째 줄을 고쳐야 하는지 알려 드려요.

이 검사는 흔한 실수를 잡아내지만 모든 비밀을 찾아내지는 못해요. 무엇을 게시할지 직접 고르는 것이 여전히 비밀을 지키는 방법이에요. 자세한 내용은 보안 & 신뢰과 사이트 게시하기에서 확인하세요.