Base64
Base64는 바이너리 데이터를 ASCII 문자열로 변환하는 인코딩 방식입니다.
이 방식은 바이너리 데이터를 텍스트 형식으로 안전하게 전송하거나 저장할 수 있게 해줍니다.
Base64는 주로 이메일 메시지의 첨부파일, 웹에서 이미지 데이터를 전송하거나, 복잡한 정보를 URL 안에 인코딩하는 데 사용됩니다.
Base64 인코딩은 바이너리 데이터를 6비트 단위로 잘라서 64개의 인코딩된 문자 중 하나를 대응시킵니다.
만약 입력 데이터의 길이가 6비트가 안되어 공백을 채워야 한다면, 패딩 문자 '='가 추가됩니다.
예제 : Base64를 HTML 소스로 바로 입력해보자
<!DOCTYPE html>
<html>
<body>
<h2>Base64 Encoded Image</h2>
<p>An image from Base64 data:</p>
<img src="data:image/jpeg;base64,/9j/4AAQSk... (rest of the base64 encoded image) ...EASZJUAEAAD//2Q==" alt="Base64 Encoded Image">
</body>
</html>
img 태그의 src 속성에서 "data:image/jpeg;base64,"는 소스가 Base64로 인코딩된 JPEG 이미지임을 지정하는 데 사용됩니다.
이 접두사 뒤에 실제 Base64로 인코딩된 이미지 데이터를 삽입합니다.
...(base64로 인코딩된 이미지의 나머지 부분) ...을 실제 Base64로 인코딩된 이미지 데이터로 바꾸세요.
Base64로 인코딩된 이미지는 HTML에서 직접 사용할 수 있으며,
이는 페이지를 로드하는 데 필요한 HTTP 요청 수를 줄이기 때문에 작은 이미지에 유용할 수 있습니다.
그러나 이미지가 크면 HTML 문서가 상당히 커질 수 있습니다.
부족한 점이나 잘못 된 점을 알려주시면 시정하겠습니다 :>
728x90
'DEV > Frontend' 카테고리의 다른 글
| Electron Browser Window 숨기는 방법 (0) | 2024.01.24 |
|---|---|
| Electron 개발환경에서 캡처가 되지 않았던 이유 (0) | 2024.01.24 |
| React Rout로 Login Redirect 하는 방법 (0) | 2023.02.15 |
| React Local storage에 값이 저장되지 않아요 (0) | 2023.02.13 |
| React 서버에서 잘 보낸 쿠키가 저장 되지 않는다 feat fastify (0) | 2023.02.09 |
