본문 바로가기

목록이 없습니다.

[JavaScript] 어떻게하면 로그인 시 원래 보고 있던 페이지로 이동시킬 수 있을까?

Framework/jQuery
    반응형

    인터넷을 사용하다 보면 잘 만들어진, 잘 구성되어있는 사이트들을 볼 수 있습니다. 잘 만들어졌다는 것은 사용자가 사용할 때 불편함이 최소화 되어 있고 원하는 정보를 잘 보여주는 것이라고 개인적으로 생각하는데요. 그런 사이트들을 보면 로그인을 했을 때 메인페이지나 정해진 페이지가 아닌 사용자가 원래 보고 있던 페이지로 이동시켜줘서 작업의 흐름을 그대로 유지해주는 사례가 많은 것 같습니다. 우리 시스템에도 요구사항으로 들어와서 구현해보려고 합니다.







    처음부터 바로 답을 찾지는 못했습니다. 가장 단순한 뒤로가기 방법인 history.back() 을 이용해서 구현해봤는데 가장 큰 문제가 사용자가 외부에서 로그인페이지로 들어온 경우에는 로그인 시 사이트를 이탈시키는 문제가 있었습니다. 따라서 위의 방법만으로는 해결방안이 아니라고 판단하고 구글링을 더 하던 도중에 아주 정리가 잘 되어 있는 블로그를 발견했습니다.


    document.referrer

    결론적으로 document.referrer를 통해서 해결했습니다. referrer란 참조하다라는 의미를 가지는데 인터넷에서 링크를 통해 이동하면 어떤 링크를 통해 왔는지 어느 페이지에서 왔는지가 남는다고 합니다. 그렇기 때문에 직접 URL을 입력해서 들어온 경우나 다른 외부 사이트에서 유입된 경우도 판단할 수 있습니다.


    // 뒤로 갈 히스토리가 있는 경우 및 우리 시스템에서 링크를 통해 유입된 경우
    if (document.referrer && document.referrer.indexOf("yoursite.com") !== -1) {
        history.back();    // 뒤로가기
    }
    // 히스토리가 없는 경우 (URL을 직접 입력하여 유입된 경우)
    else {
        location.href = "yoursite.com";    // 메인페이지로 
    }
    


    로그인 시 위의 로직을 통해서 사용자에게 더 좋은 경험을 제공할 수 있습니다.



    참고

    https://programmingsummaries.tistory.com/318

    반응형