HTML 안의 텍스트
Coddy Node.js 여정의 Express 기초 섹션에 포함된 레슨. 23개 중 9번째.
방문자는 HTML이 마크업으로 처리하는 문자를 입력할 수 있습니다. 제목에 <b>가 포함되어 있으면, 이를 페이지에 그대로 넣을 경우 태그가 만들어집니다. 이 문자들을 이스케이프하면 브라우저에 표시되는 텍스트가 됩니다.
escapeHtml('<b>Lunch</b>');
// <b>Lunch</b>이 도우미는 &를 &로 바꾸며, 브라우저에는 앰퍼샌드로 표시됩니다. 큰따옴표는 "로 바뀌고, 작은따옴표는 그대로 유지됩니다. 누가 작성했는지와 관계없이 삽입하는 모든 텍스트 값을 이스케이프한 다음, 그 주위에 직접 작성한 HTML을 넣으세요. 페이지 전체를 이스케이프하면 제목 태그도 텍스트로 표시됩니다. 도우미 함수를 직접 작성할 필요는 없습니다. 중요한 것은 어디에 사용할지 결정하는 것입니다.
URL에서는 공백을 %20으로, 앰퍼샌드를 %26으로, 꺾쇠괄호를 %3C 및 %3E로 작성하세요. 이러한 인코딩은 제목 텍스트와 쿼리 구문을 분리해 줍니다.
챌린지
쉬움exercise.js를 수정하세요. 제목을 직접 만든 제목 태그 안에 넣기 전에 제공된 도우미를 사용하세요. 완성된 제목을 html에 반환하세요.
‘플레이’를 눌러 보세요: GET /result?title=Fish%20%26%20Chips는 {"html":"<h1>Fish & Chips</h1>"}를 반환합니다. /result?title=%3Cb%3ELunch%3C%2Fb%3E도 시도해 보세요. 삽입된 제목은 텍스트여야 하며, 제목 태그는 마크업으로 유지되어야 합니다.
직접 해보기
import { escapeHtml } from './html.js';
export function exercise({ title }) {
return { html: `<h1>${title}</h1>` };
}
Express 기초의 모든 레슨
직접 연습해 보세요: Express 플레이그라운드