ci 넘기는 과정에서 +가 공백으로 들어갈 때

우선 발단은

프로젝트에서 sns로 본인인증 한다고 했을 때,

1. sns로그인
2. 추가 본인인증
3. 해당 사용자의 신규 di 생성

이런 식으로 진행이 되었다.



그러다 보안 문제로 1번과 2번의 사용자가 동일한 인물인지 판별을 해야 하는 상황이 왔는데,
문제는 di로 판별을 할 수가 없다는 것이었다. 2번이 진행완료된 후에야 생성이 되니까ㅜ

그래서 ci를 받기로 결정하였다.
1번에서 받은 ci(이하 ci_1)와 2번에서 받은 ci(이하 ci_2)를 비교해서 동일 인물인지 판단하면 되니까!

그런데 진행 과정 중에 문제가 생겼다.
ci값들은 다 잘 받아오는데, 인증이 안 되는 현상이 발생했다ㅠㅠ

왜 그런가 보니까 ci_1에 '+'가 포함되어있었는데, ci_2랑 비교할 때 보니 '+'가 사라져있고 공백으로 치환된 것이다...
결국 ci_1과 ci_2의 값이 다르니 인증이 제대로 될리가ㅠ

어디서 자꾸 공백으로 바뀌나 봤더니 중간에 url 인코딩 단계에서 바뀌는 거였다.

기존 코드는 이렇다.

var url = this.startURL+requestType+'.do?a='+a+"&b="+b+"&ci="+ci;

공백이나 특수 문자가 포함된 url은 안전하게 전달하기 위해 url은 인코딩이 필요하다.
내가 넘겨준 ci에는 특수문자가 있으니 url 인코딩 시 '+'가 공백으로 인식되는 상황이 발생한 것 같다.


그래서 코드를 바꿔주었다.

var url = this.startURL+requestType+'.do?a='+a+"&b="+b+"&ci="+encodeURIComponent(ci);

'+' 기호를 그대로 사용하기 위해서는 encodeURIComponent()나 encodeURI() 함수를 사용하면 된다.

encodeURIComponent()와 encodeURI() 함수의 차이점은 간단히 말하자면
encodeURI()는 url 전체를 입력으로 받기 때문에 url 전체를 인코딩 할 때 쓰면 되고,
encodeURIComponent()는 url에서 인코드할 부분만 입력으로 받기 때문에 url 파라미터를 인코딩 할 때 쓰면 된다.

encodeURIComponent()와 encodeURI() 함수에 대해 더 자세한 내용을 알고 싶다면 여기를 참고하면 된다!

나는 파라미터를 인코딩 하면 됐으니 encodeURIComponent()를 적용했다.

결과는 내가 원하는 '+'가 제대로 들어온다는 것! ^ㅇ^ 오예