질문/조언질답게시판

일반적으로 뒤로가기 동작으로 이전 페이지로 갈 수 있지만,

새창 띄우기나 팝업으로 페이지가 열렸을 때 뒤로가기를 누르면 반응이 없는 경우가 있습니다.

이 경우를 감지해서 이전 페이지가 없을 때는 창을 닫고 싶은데요.

좋은 방법이 없을까요?

 

document.referrer를 써봐도 부모창의 주소를 가지는 것으로 나오고요...

참고로, 이전 페이지가 없을 때 브라우저에서 우클릭하면 '뒤로' 메뉴가 비활성화되잖아요?

그런 걸 보면 뭔가 방법이 있을 것 같은데 찾지를 못하겠습니다;;;

  • profile
    창을 닫는 용도로만 쓰는거라면
    history.back 을 호출하고 그 후 바로 창 닫는 함수를 또 호출하면 되지 않을까 싶은데요.

    뒤로 갈 페이지가 있다면,
    history.back 을 호출시 이전 페이지로 이동될거고, 그렇게 되면 그 뒤의 코드가 실행될 여지가 없어지겠죠?

    뒤로 갈 페이지가 없다면,
    뒤로 이동되지 않으니 그 뒤의 코드도 실행이 될거고, 퐈면도 닫힐거고...
  • profile profile

    엥, 그렇게 되나요? 얼른 해볼게요~

    덧. ㅠㅠㅠ 그냥 창이 닫힙니다;;;;

  • profile profile
    아.. 이전 페이지 로드 전까지는 현재 페이지에 머물러 있어서 그런가보네요.

    그보다 팝업의 경우에서만을 고려하는거라면..
    window.parent 의 존재여부를 확인하거나 history.length 의 값을 비교하는 정도로도 처리할 수 있지 않을까요?
  • profile profile
    1. window.parent 확인해서 document.referrer와 일치하는 경우 창 닫기
    -> 팝업을 띄운 상태에서 부모창 주소가 바뀔 경우 document.referrer와 불일치해서 창 닫기 실패

    2. history.length의 경우 앞으로 가기 실행이 있으면
    -> length가 누적적으로 늘어나서 창 닫기 실패

    가 되더라구요ㅜㅜ

    말씀하신 것에서 힌트를 얻었는데, history.back() 호출하고 setTimeout을 줘서 window.close() 하면 어떨까 싶네요. @[email protected]
  • profile profile

    setTimeout 함수 쓰니까 되네요. 감사합니다ㅡㅜ
    시간은 300 정도로 했구요. 200은 뒤로 가기 전에 간헐적으로 창이 닫히더군요.
    400은 이전 페이지가 없을 때 창 닫기 반응 속도가 좀 느린 것 같구요.

  • profile profile
    setTimeout 을 주는건 임시방편이지 않나 싶네요.
    네트워크 환경이 좋지 않으면 똑같이 창이 닫히는건 동일할테니까요.

    1. typeof window.parent != 'undefined' 를 사용하지 않는 이유가 무엇인지요?
    라고 쓰고보니 parent 창이 팝업인 경우도 고려해야 할 수 있겠네요.
    흠.

    2. 배보다 배꼽이라는 느낌이 물씬 풍기지만
    history.back() 호출 후, window.unload 이벤트가 호출되는지 확인하는 방법도 있겠네요.
    unload 되면 이전 페이지가 있는거고, 아니면 없는거고...
  • profile profile
    음, 역시 임시방편이겠네요.
    말씀해주신 방법을 다시 확인해보겠습니다.
  • profile profile

    테스트 해 보지는 않았습니다만...!

    historyBack(-1, function(){ window.close(); }); 와 같은 방식으로 사용하시면 될겁니다!

     

    function historyBack(count, fallback){
      var hasHistory = false;
    
      window.history.go(count);
      window.addEventListener('beforeunload', function(e){ hasHistory = true; });
    
      setTimeout(function(){
        if(!hasHistory) fallback();
      }, 200);
    }
    
    historyBack(-1, function(){ window.close(); });

     

  • profile profile
    언로드 직전에 히스토리 있다고 해주고,
    언로드가 안 일어나면 히스토리가 없으니까 창을 닫는 거군요.
    시도해보겠습니다~
  • profile profile

    감사합니다. 잘 됩니다ㅜㅜ

    개인적으로 카운터나 폴백을 인자로 넘기지는 않아도 되는 상황이어서 이렇게 적용했어요. 함수 이름도 html 소스 수정하기 귀찮아서 그냥 그대로 사용했습니다.

    function goBackOrClose()
    {
        var hasHistory = false;
    
        window.history.back();
        jQuery(window).on('beforeunload', function(event) {
            hasHistory = true;
        });
    
        setTimeout(function() {
            if ( !hasHistory ) window.close();
        }, 200);
    }

     

    이렇게 하니까 잘 작동합니다.

    근데 setTimeout 지연시간을 100으로 해도 무방하겠죠?

    100이면 beforeunload 이벤트 작동이 충분할 것 같은데요.

    기왕이면 빠릿빠릿한 게 좋아서요ㅎㅎㅎ

    아, 브라우저나 pc 성능에 따라 다르려나요...

  • profile
    history back 에 해당하는 주소에 back 하시전에 ajax로 페이지가 있는지 확인 하는 방법정도 생각하네요
  • profile profile
    ajax로 미리 가봤다가 다시 돌아오라는 말씀이신 거죠?
    아아, 점점 일이 커지는 것 같아요ㅜㅜ
  • profile profile
    갔다가 돌아오는게 아니고 체크를 ajax로 해서 다음 동작을 정하는거죠 ㅎ
  • profile profile

    ajax 관계된 거라면 혹시 history.pushState나 popstate 이벤트를 사용하는 건가요?

  • profile profile
    history.back을 했을때의 주소를 먼저 얻어와야겠죠.
    근데 일반적인 방법으로는 접근이 안되는것 같고 쿠키 같은곳에 기존 주소를 보관해서 써야 하는것 같네요.
  • profile profile
    으아아.. 역시 복잡하네요. 간단하게 될 줄 알고 시작했다가 1박2일이 지나고 있어요ㅋㅋㅋ큐ㅠㅠㅠㅠ