이스케이프 변환기
HTML·JS·JSON 문자열 이스케이프와 역변환을 처리합니다.
따옴표가 들어간 문장을 자바스크립트 변수에 넣었더니 문법 오류가 나거나, <div> 같은 태그를 화면에 글자 그대로 보여 주고 싶은데 자꾸 렌더링될 때가 있습니다. 이 도구는 그런 특수문자를 안전한 표기로 바꾸고(이스케이프), 반대로 이미 변환된 문자열을 원래 글자로 되돌립니다(역변환). 처리는 브라우저 안에서만 이뤄집니다.
어떻게 계산되나요
세 가지 유형
유형 을 고르고 이스케이프 또는 역변환 을 누릅니다. 유형마다 다루는 문자가 다릅니다.
| 유형 | 변환 대상 | 예시 |
|---|---|---|
| HTML 엔티티 | & < > " ' | <b> → <b> |
| JS 문자열 | \ ' " \ 와 줄바꿈·탭 | 줄1\n줄2 → 줄1\\n줄2` | |
| JSON 문자열 | JSON 규격 전체 | a"b → "a\\"b" |
언제 무엇을 쓰나
- HTML 엔티티: 사용자가 입력한 글을 화면에 출력할 때. 태그가 실행되지 않고 글자로 보입니다.
- JS 문자열: 코드 안에 따옴표·줄바꿈이 든 문장을 한 줄 리터럴로 넣을 때.
- JSON 문자열: API 요청 본문이나 설정 파일 값으로 넣을 때. 결과에 바깥 큰따옴표까지 포함되므로 그대로 값 자리에 붙여넣으면 됩니다.
역변환은 반대로 동작합니다. JSON 역변환은 입력이 완전한 JSON 문자열(양끝 따옴표 포함)이어야 하며, 아니면 오류가 납니다.
주의: 이 도구는 표시를 위한 변환이지 보안 필터가 아닙니다. 실제 서비스에서는 출력 위치(HTML 본문·속성·URL·스크립트)에 맞는 처리를 서버·프레임워크 단에서 함께 해야 합니다.
용어 정리
- 이스케이프
- 특수문자를 코드가 아닌 데이터로 읽히도록 다른 표기로 바꾸는 것.
- HTML 엔티티
- `<` 처럼 `&이름;` 형태로 적는 문자 표기. 브라우저가 원래 글자로 그려 줍니다.
- 문자열 리터럴
- 코드 안에 따옴표로 직접 적는 문자열 값. 따옴표·역슬래시는 그대로 넣을 수 없습니다.
- 역슬래시(\\)
- 다음 글자를 특별하게 읽으라는 표시. `\\n`은 줄바꿈, `\\\\`는 역슬래시 한 개입니다.
- 역변환
- 이스케이프된 문자열을 사람이 읽는 원래 글자로 되돌리는 것.
자주 묻는 질문
HTML 엔티티로 바꾸면 XSS가 막히나요
출력 위치가 HTML 본문이라면 대부분의 태그 삽입을 막아 줍니다. 다만 속성값·URL·스크립트 안처럼 문맥이 다르면 필요한 처리도 달라집니다. 실제 서비스에서는 서버나 템플릿 엔진의 출력 이스케이프를 기본으로 두고 이 도구는 확인용으로 쓰는 편이 안전합니다.
JSON 이스케이프 결과에 큰따옴표가 붙어 나옵니다
정상입니다. JSON에서 문자열 값은 양끝 큰따옴표를 포함한 형태가 완성된 값이라 그대로 출력합니다. 따옴표 없이 안쪽만 필요하면 양끝 한 글자씩 지우고 쓰세요.
JS 유형과 JSON 유형은 뭐가 다른가요
JS 유형은 따옴표·백틱·역슬래시와 줄바꿈·탭만 바꾸고 바깥 따옴표를 붙이지 않습니다. JSON 유형은 JSON 규격에 맞춰 전체를 처리하고 따옴표까지 감쌉니다. 코드에 직접 붙여넣을 때는 JS, 데이터로 주고받을 때는 JSON이 편합니다.
역변환했더니 오류가 납니다
JSON 유형은 입력이 올바른 JSON 문자열이어야 합니다. 양끝 따옴표가 빠졌거나 중간에 잘린 값이면 파싱에 실패합니다. 입력을 다시 확인하거나, 단순히 `\n` 같은 표기만 풀고 싶다면 JS 유형으로 역변환해 보세요.
한글이나 이모지도 바뀌나요
바뀌지 않습니다. 이 도구는 구문을 깨뜨리는 특수문자만 다루므로 한글·이모지는 그대로 남습니다. 코드포인트(`\u...`) 표기가 필요하면 유니코드 도구를 쓰세요.
어떤 문제가 있었는지 알려주시면 빠르게 고치겠습니다. (회신이 필요하면 이메일을 남겨주세요)