홈으로 | 무료회원가입 | 아이디/비번찾기
추천음악방송 메인홈 1대1상담
운.영.자.1대1.상담
온라이브음악방송
온라이브스토어(앱다운로드)
아리랑가요(무료음악채널)
뽕짝아가씨(무료음악채널)
okTrot(무료음악채널)
전통가요(무료음악채널)

환상의뽕짝파티 무료음악
명작트로트메들리 무료음악
트로트메들리관광 무료음악
보안∵서버∵쿠키
윈도우∵프레임
이미지∵배경
시간∵달력∵계산
상태바∵타이틀바
음악∵영상
폼∵전송∵테이블
키보드∵마우스
효과∵링크∵메뉴
Script∵php
기타
PHP 강좌
윈도우관련팁
웹관련팁
홈페이지제작팁
기본강좌
레지스트리
윈도우서버
리눅스서버
Android
자바스크립트 인코딩, 디코딩
9년 전
escape() / encodeURI() / encodeURIComponent()

이 모든 함수는 자바스크립트에서 인코딩을 담당하는 함수이다.

여기서 말하는 인코딩이란, 네트워크를 통해서 정보를 공유할 때 어떤 시스템에서나 읽을 수 있는 ASCII 문자로 바꿔주는 것을 말한다. 모든 네트워크를 통한 전송에는 ASCII 문자가 기반이 된다. 특히 한글이나 특수문자의 경우 이를 2진수 바이트코드로 변환해서 전송하면 받는 상대편의 시스템에 따라 잘못 해석되거나, 해석이 불가능할 수 있기 때문이다.

이를 해결하기 위해 모든 시스템에서 공통으로 읽을 수 있는 ASCII 문자로 바꿔서 데이터를 전송할 필요가 있다.



1. escape()

아래 열거된 아스키문자가 아니라면 모두 유니코드 형식으로 변환한다.



ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890
@*-_+./


그 변환된 형식은 16진수 형식으로 표시되며 1바이트 문자는 %XX 형태로, 2바이트 문자는 %uXXXX 형태로 변환된다.
1바이트 문자는 빈칸(%20)을 들 수 있고, 2바이트 문자는 한글(%uD55C%uAE00)이 있을 수 있다.

가끔 인터넷검색을 하면 주소창에 %XX형식의 문자들이 들어있는 것을 볼 수 있는데, 이는 인코딩 된 것의 한 종류라고 볼 수 있다.

가끔은 홈페이지의 자바스크립트나 HTML 소스, 음원URL을 보기 힘들게 하기 위해 사용하기도 하지만,
이는 자바스크립트의 인코딩을 아는 자라면 어렵지 않게 풀어 사용할 수 있다.


2. encodeURI()

기본적으로는 escape()와 비슷한 동작을 하지만 인터넷 주소표시에 쓰이는 특수문자들을 인코딩하지 않는다.
즉,  : ; / = ? &  등의 특수문자는 인코딩이 되지 않는다.
그래서 보통은 파라미터를 전달하는 인터넷주소(URL) 전체를 인코딩할 때 사용한다.



3. encodeURIComponent()

기본적인 동작은 역시 escape()와 비슷하지만 인터넷 주소표시에 쓰이는 모든 문자를 추가로 인코딩한다.
즉,  : ; / = ? &  등의 특수문자가 추가로 인코딩 되는 것이다.

그래서 인터넷주소(URL) 전체를 인코딩할 때는 사용할 수 없고, 넘기는 필드 하나하나를 따로 인코딩할 때 사용한다.
그 이유는 넘어가는 값이 text="test=&테스트" 이와 같이 text라는 필드 값이 test=&테스트인 경우 그냥 encodeURI()로 인코딩 하면, '=' 나 '&'는 인코딩되지 않아서 필드값을 처리할 때 데이터값이 아닌 여러개의 필드를 넘기는 명령어로 인식할 수 있기 때문이다.

하지만, "http://test.com/test.php?text=테스트" 와 같은 URL 전체를 encodeURIComponent()로 인코딩하게 되면 : / ? 를 모두 인코딩하여 주소를 인식할 수 없게 된다.



4. 실제 인코딩의 차이를 보여주는 Javascript 소스



view plaincopy to clipboardprint?
var chr = 'http://test.com/folder1/folder2/default.html?mode=write&value=&*테스트';    
  
document.writeln("original = " + chr + '<br />');    
document.writeln("escape() = <font color='red'>" + escape(chr) + "</font><br />");    
document.writeln("encodeURI() = <font color='blue'>" + encodeURI(chr) + "</font><br />");    
document.writeln("encodeURIComponent() = <font color='orange'>" + encodeURIComponent(chr) + "</font><br />");  
var chr = 'http://test.com/folder1/folder2/default.html?mode=write&value=&*테스트';

document.writeln("original = " + chr + '<br />');
document.writeln("escape() = <font color='red'>" + escape(chr) + "</font><br />");
document.writeln("encodeURI() = <font color='blue'>" + encodeURI(chr) + "</font><br />");
document.writeln("encodeURIComponent() = <font color='orange'>" + encodeURIComponent(chr) + "</font><br />");


위의 소스를 <script></script> 안에 넣고 실행하면 인코딩의 차이를 직접 확인 할 수 있으며,
직접 인코딩과 디코딩 결과를 확인 하고 싶은 경우 "Javascript String Encoder"를 참고하시기 바랍니다.


  ecodeURI, decodeURI : &, + , =  인코딩이 불가능 ...

  encodeURIComponent,decodeURIComponent  : &, + , =  인코딩이 가능 ...
추천추천 : 246 추천 목록
번호 제목
3,026
 여러 도메인들 간 쿠키 공유하기
3,025
 태그 사이에 있는 텍스트를 추출
3,024
 [JQuery] textbox focus on off일때 숫자 콤마 보여주기
3,023
 쿠키 생성,가져오기,삭제
3,022
 사용자 함수 모음
3,021
 마우스,키보드 제한 ( 오른쪽클릭,드래그,영역선택등..)
3,020
 [HTML5] <video> - DOM으로 제어하기
3,019
 HTML5 video 태그에서 영상 좌우반전
3,018
 PHP - 특정 태그 및 문자열 추출, 제거
3,017
 [PHP] define과 defined의 차이
3,016
 우클릭 완벽차단 스크립트
3,015
 iframe 높이 100% 맞추기
3,014
 curl 함수를 이용한 HTTP REFERER 변경
3,013
 윈도우10 시스템 파일 및 Dism 검사
3,012
 텍스트 줄바꿈, 글자자르기 CSS
3,011
 jQuery Mobile에서 유용한 코드 10가지.
3,010
 [PHP] dirname()함수와 $_SERVER 관련 상수들
3,009
 [PHP] 파일 크기, 사이즈 불러오는 함수, filesize()
3,008
 [jQuery] jQuery Quick API
3,007
 [ transition ] 링크 hover 색상 변화 속도 조절
3,006
 PHP 5.3.0 에서 사라진 함수들 대체
3,005
 어떤 파일들이 include 나 require 되었는지 확인하는 함수(get_included_files)
3,004
 PHP 날짜 형식 및 계산하기(날짜 더하고 빼기)
3,003
 jQuery Mobile에서 유용한 코드 10가지.
3,002
 값이 배열 안에 존재하는지 확인하는 in_array함수
목록
추억의가요방(가사포함)
인기절정뽕짝파티
인기트로트모음
지루박디스코메들리
밤무대애창곡
전자올겐경음악
세월따라노래따라
가슴시린트로트
트로트쌍쌍파티
7080추억속으로
종합성인가요방
못잊을옛날노래
카바레 음악
트롯디스코팡팡
관광 메들리
트롯카페
가요감상실
추억의옛노래
스페셜가요광장
BillBoard Free
추천가요모음
경음악.전자올겐
스페셜음악여행
WOLRD POPs
K-POP\BillBoard
POP TOP BEST

최신인기가요특집
추천가요\인기
F뮤직 인기\발라드
F뮤직 애창\트로트
트로트성인가요
인기가요
프리미엄 POP
경음악\기타
프리미엄 최신가요
프리미엄 성인가요
뮤직트로트 부산광역시부산진구 가야동 ㅣ 개인정보취급방침
Copyright (C) musictrot All rights reserved.