Javascript HTML URL kodlama(encoding) ve kodu çözme(decoding) kodu kullanımı örneği (JavaScript HTML URL encoding and decoding code usage example)

JavaScript ile birlikte gelmekte olan “encodeURI()” ve “encodeURIComponent()” fonksiyonları ile URL standartında olmayan diğer karakterleri de URL içinde bulundurabilirsiniz. Bu kodlara hexadecimal(onaltılık) tabanda çalışır, yani ASCII karakterlerinin onaltılık tabanlı değerlerini kullanarak çalışır, çıkan değer önüne ise “%” (yüzde) işareti alır.

encodeURI() işlemi “$ – _ . + ! * ‘ ( ) , ~ # ; / ? : @ & =” bu karakterleri kodlamaz, daha geniş bir kodlama yapmak isterseniz encodeURIComponent() fonksiyonunu kullanabilirsiniz.
encodeURIComponent() ise “- _ . ! * ‘ ( ) ~” karakterlerini kodlamaz.

encodeURI() içerisinde başka bir hedef URL bulunmayan URL leri için kullanılır.
encodeURIComponent() ise içerisinde başka bir hedef URL barındıran URL ler için, ilk önce iç kısımda bulunması gereken hedef URL encodeURIComponent() ile kodlandıktan sonra ilgili URL e eklenir.

URL in kodlanmış(encoded) veya kodlanmamış olduğunun kontrolünü “%\d{2}” regex i ile minimuma indirip kontrol edebilirsiniz, karşınıza çok farklı formatlarda URL ler çıkabilir bundan dolayı bu regex ifadesi kesin çözüm değildir.

encodeURI() örnek kullanımları şöyledir.

var url = "http://www.yazilimcity.net/kodlanmamış";
var encodedURL = encodeURI(url);

console.log(encodedURL);

sonuç çıktımız şöyledir.

http://www.yazilimcity.net/kodlanmam%C4%B1%C5%9F

encodeURIComponent() örnek kullanımları şöyledir.

var url = "http://www.yazilimcity.net/kodlanmamış";
var encodedComponentURL = encodeURIComponent(url);

console.log(encodedComponentURL);

sonuç çıktımız şöyledir.

http%3A%2F%2Fwww.yazilimcity.net%2Fkodlanmam%C4%B1%C5%9F

bir başka örneğimiz

var abc = "ıabcödef&.com";
console.log(encodeURI(abc));
console.log(encodeURIComponent(abc));

sonuç çıktımız şöyledir.

%C4%B1abc%C3%B6def&.com
%C4%B1abc%C3%B6def%26.com

kodlamanın çözümü için ise bu fonksiyonlar kullanılır.

decodeURI()
decodeURIComponent()

encode listesi

space %20
! %21
” %22
# %23
$ %24
% %25
& %26
‘ %27
( %28
) %29
* %2A
+ %2B
, %2C
– %2D
. %2E
/ %2F
0 %30
1 %31
2 %32
3 %33
4 %34
5 %35
6 %36
7 %37
8 %38
9 %39
: %3A
; %3B
< %3C = %3D > %3E
? %3F
@ %40
A %41
B %42
C %43
D %44
E %45
F %46
G %47
H %48
I %49
J %4A
K %4B
L %4C
M %4D
N %4E
O %4F
P %50
Q %51
R %52
S %53
T %54
U %55
V %56
W %57
X %58
Y %59
Z %5A
[ %5B
\ %5C
] %5D
^ %5E
_ %5F
` %60
a %61
b %62
c %63
d %64
e %65
f %66
g %67
h %68
i %69
j %6A
k %6B
l %6C
m %6D
n %6E
o %6F
p %70
q %71
r %72
s %73
t %74
u %75
v %76
w %77
x %78
y %79
z %7A
{ %7B
| %7C
} %7D
~ %7E
%7F
` %80
 %81
‚ %82
ƒ %83
„ %84
… %85
† %86
‡ %87
ˆ %88
‰ %89
Š %8A
‹ %8B
Π%8C
 %8D
Ž %8E
 %8F
 %90
‘ %91
’ %92
“ %93
” %94
• %95
– %96
— %97
˜ %98
™ %99
š %9A
› %9B
œ %9C
 %9D
ž %9E
Ÿ %9F
%A0
¡ %A1
¢ %A2
£ %A3
¤ %A4
¥ %A5
¦ %A6
§ %A7
¨ %A8
© %A9
ª %AA
« %AB
¬ %AC
%AD
® %AE
¯ %AF
° %B0
± %B1
² %B2
³ %B3
´ %B4
µ %B5
¶ %B6
· %B7
¸ %B8
¹ %B9
º %BA
» %BB
¼ %BC
½ %BD
¾ %BE
¿ %BF
À %C0
Á %C1
 %C2
à %C3
Ä %C4
Å %C5
Æ %C6
Ç %C7
È %C8
É %C9
Ê %CA
Ë %CB
Ì %CC
Í %CD
Î %CE
Ï %CF
Ð %D0
Ñ %D1
Ò %D2
Ó %D3
Ô %D4
Õ %D5
Ö %D6
× %D7
Ø %D8
Ù %D9
Ú %DA
Û %DB
Ü %DC
Ý %DD
Þ %DE
ß %DF
à %E0
á %E1
â %E2
ã %E3
ä %E4
å %E5
æ %E6
ç %E7
è %E8
é %E9
ê %EA
ë %EB
ì %EC
í %ED
î %EE
ï %EF
ð %F0
ñ %F1
ò %F2
ó %F3
ô %F4
õ %F5
ö %F6
÷ %F7
ø %F8
ù %F9
ú %FA
û %FB
ü %FC
ý %FD
þ %FE
ÿ %FF

Share on Facebook0Tweet about this on TwitterShare on Google+0Share on StumbleUpon0Share on Reddit0

Leave a Reply


*