본문 바로가기

Programming/Node.js

3. Front-end Javascript (3) - encode(decode)URIComponent

node js logo image

 

 

 

 

 

AJAX 요청과 관련된 또 하나의 기능을 살펴보도록 하겠습니다. 요청을 보낼 때 URL에 한글이 들어가는 경우도 존재합니다. 그런데 서버에 따라서는 이러한 한글이 포함된 URL을 처리하지 못하는 경우가 있기 때문에, 별도의 처리가 필요합니다. 

 

이럴 때 사용하는 메서드가 encodeURIComponent입니다. 이는 window 객체의 메서드인데, 노드에서도 사용이 가능합니다. 사용 방법은 간단합니다. 한글 주소 부분만 encodeURIComponent 메서드로 감싸주면 됩니다. 아래 예제에서 적용하는 방식을 살펴보겠습니다. 

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>
        (async () => {
                try{
                    const result = await axios.get('https://www.zerocho.com/api/search/${encodeURIComponent('노드')}');
                    console.log(result);
                    console.log(result.data);  
                } catch (error) {
                    console.error(error);
                }
            }
        )();
    </script>
</head>
<body>
    
</body>
</html>

 

 

 

한글 주소는 %EB%85%B8%...라는 형식의 문자열로 변환됩니다. 받은 쪽에서는 decodeURIComponent(' %EB%85%B8%...'); 를 이용해서 원래의 한글로 변환하게 됩니다.