[JS] A태그 내에서 Javascript 의 encodeURIComponent 사용 문제

원래 기대하고자 했던 동작은,

 

1. 하이브리드 앱에서 버튼을 눌러 문자열을 앱에 전달 하고자 한다. 이 때, 문자열은 URI 인코딩이 되어야 한다.

2. 그래서 A 태그에서 encodeURIComponent 를 실행 시켜서 인코딩을 하고 앱에 전달한다

<a href="javascript:encodeURIComponent('인코딩문자열')">Example</a>

 

였는데, iOS / Android 의 WebView 부분에서 확인해보니 Android 는 정상적으로 데이터를 전송 받을 수 있었는데 iOS 에서는 그렇지 않은 일반 평문으로 받게 되었다.

 

개발자들의 만능 홈페이지인 StackOverflow 에도 이에 대한 해답이 나오지 않았고, 애초에 앱 자체로 들어가는 데이터가 다르게 들어간 것을 보니 앱 내에서의 문제는 아닌 것 같았다.

 

여러 시행 착오를 거쳐 해결할 수 있는 방법을 찾았으니...

 

iOS 에서는 해당 메소드를 href 에서 바로 사용할 수는 없고, 메소드를 하나 거쳐서 실행해야 가능한 일이었다.

 

<script>
function encodeAndSend(str){
 return app(encodeURIComponent(str));
}

function app(encoded){
	//code
}
</script>

<!-- 해당 방식으로 인코딩을 시킬 수 없다. -->
<a href="javascript:app(encodeURIComponent('인코딩할문자열'))"></a>

<!-- 메소드를 한번 거쳐서 받을 수 있도록 한다. -->
<a href="javascript:encodeAndSend('인코딩할문자열')"></a>