D2CampusFest / 4th

31 stars 2 forks source link

[mjkim610/Sherlock] js로 client의 IP address 받아오기 #12

Closed kim-sardine closed 7 years ago

kim-sardine commented 7 years ago

저희가 사용하는 Browser finger print 의 요소 중 하나가 사용자의 IP 주소입니다. 현재 로그인 또는 회원가입 등 버튼 클릭시 자바스크립트 ajax를 통해 비동기식으로

$.get("http://ipinfo.io", function(response) {
    var ip = response.ip;
}

위와 같은 방식으로 ip를 얻어온 후 총 27개의 finger print 요소를 사용해 다시 비동기식으로 API 서버와 소통합니다.

문제는 위와 같은 방식으로 IP 주소를 가져오게 되면 한번 http://ipinfo.io 라는 사이트에 들려 결과값을 받아와야하기 때문에 상당히 많은 시간이 소요된다는 것입니다.

혹시 더 간단하고 빠른 방식으로 모든 사용자에 대해(서버 언어와 독립적으로) IP 주소를 받아올 수 있는 방법이 있을까요?

g6123 commented 7 years ago

어떤 서버든 요청을 날리지 않고 Client IP를 가져오는 건 어려운 것 같아요.

"굳이" Client-side에서만 받아오려고 한다면 Flash를 도입할 수는 있을 것 같네요. 실제로 socket.io에서는 Websocket이 지원되지 않는 환경에서는 Flash를 Polyfill로 사용했었어요.

kbu1564 commented 7 years ago

apache라든가 nginx 혹은 nodejs로 구현한 서버에서 넘겨주는 ip 주소를 server side language 들을 거치거나 활용하지 않고 독립적으로 얻는 방법은 힘들 것이라 생각합니다. 아마.. 득보다 실이 더 클 것 같다고 생각합니다. 그래도 제 생각을 말씀드리자면..

소스 상에서 ip를 활용하는 로직이 거의 javascript 로 묶에 있던데

서버언어에 종속되지 않고서 하길 원하신다면., websocket 을 활용하여 client ip 를 얻으시는 방법은 어떠신가요?

대신 이방법에도 단점이 존재한다 생각합니다. websocket을 브라우져에서 제공을 해줘야 하는 부분인데 옛날 브라우져를 사용하는 사람의 경우, websocket을 제공하지 않아 서비스 이용이 불가능하여, 정상적인 아이피 주소를 얻기 힘드리라 생각합니다.

아니면.. 나중에 규모가 커질 경우를 대비한다면, fingerprint 부분을 담당하는 로직과 ip얻는 부분등을 분리하여 자체적으로 이러한 정보들을 제공하는 내부 api 서버를 만들어서 활용하시는 것도 좋을것 같습니다.

아이디어가 해당 로직을 다른곳에서 해당 소스를 포함하여 사용하는 방식이라면 괜찮을 것 같지만, 외부에서 ajax 등을 이용하여 제공받은 api에 접근하여 사용하는 구조라면, 사용자의 증가에 따라, 서버에 부하도 많이 걸릴 것 같습니다.

나중에 실제 서비스를 할때 부하가 많이 걸린다면, 현재 방식으로는 서버 늘리거나 줄일때, 지장이 생길 것이라 생각합니다.

Luavis commented 7 years ago

RTC를 이용한 굉장히 변태적인 방법이 있네요..

http://stackoverflow.com/a/36838647

g6123 commented 7 years ago

서버 언어와 완전히 독립적이라고 말하기는 어렵지만,

서버에서 첫 응답을 보낼 때 쿠키에 사용자의 IP 주소를 기록하는 건 어떨까요?

Sherlock에서는 PHP를 쓰고 있으니, 예를 들자면,

setcookie("REMOTE_ADDR", $_SERVER['REMOTE_ADDR']);

위 코드처럼 IP를 저장해 뒀다가

function getCookie(key) {
    return ('; ' + document.cookie).split(key + '=', 2)[1].split(';', 2)[0];
}

function getUserIP() {
    return getCookie('REMOTE_ADDR');
}

Client-side Javascript에서는 이렇게 Cookie 값을 불러오기만 하면

추가적인 서버 부담도 사실상 없고 쉽게 값을 불러 올 수 있을 듯합니다.