[javascript] 사용자가 브라우저 기록으로 돌아갈 수 있는지 확인하는 방법

JavaScript를 사용하여 기록이 있는지 여부를 확인하고 싶습니다. 브라우저에서 뒤로 버튼을 사용할 수 있는지 여부를 의미합니다.



답변

짧은 대답 : 할 수 없습니다.

기술적으로 정확한 방법이 있습니다.이 방법은 속성을 확인하는 것입니다.

history.previous

그러나 작동하지 않습니다. 이것의 문제는 대부분의 브라우저에서 보안 위반으로 간주되며 일반적으로 undefined를 반환한다는 것 입니다.

history.length

다른 사람들이 제안한 속성입니다 …
그러나 길이는 역사의 현재 위치 를 나타내지 않기 때문에 완전히 작동하지 않습니다 . 또한 항상 같은 숫자로 시작하지는 않습니다. 예를 들어 방문 페이지를 갖도록 설정되지 않은 브라우저는 0에서 시작하지만 방문 페이지를 사용하는 다른 브라우저는 1에서 시작합니다.

대체 텍스트

대부분의 경우 다음을 호출하는 링크가 추가됩니다.

history.back();

또는

 history.go(-1);

되돌아 갈 수 없다면 링크를 클릭해도 아무런 효과가 없을 것으로 예상됩니다.


답변

확인하는 또 다른 방법이 있습니다-리퍼러를 확인하십시오. 첫 페이지에는 일반적으로 빈 리퍼러가 있습니다 …

if (document.referrer == "") {
    window.close()
} else {
    history.back()
}


답변

내 코드는 브라우저가 한 페이지 뒤로 돌아가도록 허용하고 실패하면 대체 URL을로드합니다. 또한 해시 태그 변경도 감지합니다.

뒤로 버튼을 사용할 수없는 경우 대체 URL은 500ms 후에로드되므로 브라우저는 이전 페이지를로드 할 시간이 충분합니다. window.history.go(-1);js 스크립트가 아직 중지되지 않았기 때문에 대체 URL을로드하면 브라우저에서 대체 URL을 사용하게됩니다.

function historyBackWFallback(fallbackUrl) {
    fallbackUrl = fallbackUrl || '/';
    var prevPage = window.location.href;

    window.history.go(-1);

    setTimeout(function(){
        if (window.location.href == prevPage) {
            window.location.href = fallbackUrl;
        }
    }, 500);
}


답변

여기 내가 한 일이 있습니다.

내가 사용하는 ‘beforeunload’이벤트를 부울을 설정할 수 있습니다. 그런 다음 ‘beforeunload’가 시작되었는지 시간 초과를 설정했습니다.

var $window = $(window),
    $trigger = $('.select_your_link'),
    fallback = 'your_fallback_url';
    hasHistory = false;

$window.on('beforeunload', function(){
    hasHistory = true;
});

$trigger.on('click', function(){

    window.history.go(-1);

    setTimeout(function(){
        if (!hasHistory){
            window.location.href = fallback;
        }
    }, 200);

    return false;
});

주요 브라우저 (FF, Chrome, IE11에서 테스트 됨)에서 작동하는 것 같습니다.


답변

내 프로젝트에서 사용하는 스 니펫이 있습니다.

function back(url) {
    if (history.length > 2) {
        // if history is not empty, go back:
        window.History.back();
    } else if (url) {
        // go to specified fallback url:
        window.History.replaceState(null, null, url);
    } else {
        // go home:
        window.History.replaceState(null, null, '/');
    }
}

참고 : History.js 를 사용 하여 브라우저 기록을 관리합니다.


history.length를 숫자 2와 비교하는 이유는 무엇입니까?

Chrome의 시작 페이지는 브라우저 기록에서 첫 번째 항목으로 계산되기 때문입니다.


몇 가지 가능성 history.length과 사용자 행동이 있습니다.

  • 사용자 는 브라우저에서 비어있는 새 탭 을 연 다음 페이지를 실행합니다. 이 경우 사용자가 빈 탭으로 이동하기 때문에 history.length = 2비활성화하고 싶습니다 back().
  • 사용자는 이전의 링크를 클릭하여 새 탭 에서 페이지를 엽니 다 . history.length = 1다시 우리는 back()메소드 를 비활성화하고 싶습니다 .
  • 마지막으로 사용자는 몇 페이지를 다시로드 한 후 현재 페이지에 도착 합니다 . history.length > 2이제 back()활성화 할 수 있습니다.

참고 : 외부 웹 사이트에서 링크를 클릭하지 않고 사용자가 현재 페이지에 방문하면 사례가 생략됩니다 target="_blank".

참고 2 : document.referrer 주소를 입력하여 웹 사이트를 열 때와 웹 사이트가 ajax를 사용하여 하위 페이지를로드 할 때 비어 있으므로 첫 번째 경우에는이 값을 확인하지 않았습니다.


답변

이것은 트릭을 수행하는 것 같습니다.

function goBackOrClose() {

    window.history.back();
    window.close();

    //or if you are not interested in closing the window, do something else here
    //e.g. 
    theBrowserCantGoBack();

}

history.back ()을 호출 한 다음 window.close ()를 호출하십시오. 브라우저가 히스토리로 되돌아 갈 수 있으면 다음 명령문으로 이동할 수 없습니다. 되돌아 갈 수 없으면 창을 닫습니다.

그러나 URL을 입력하여 페이지에 도달하면 firefox에서 스크립트가 창을 닫을 수 없습니다.


답변

다음 window.history.length항목도 포함되어 있으므로주의하십시오.window.history.forward()

따라서 window.history.length항목이 두 개 이상 있지만 기록이없는 항목 이있을 수 있습니다 . 이것은 당신이 발사하면 아무 일도 일어나지 않음을 의미합니다window.history.back()