[javascript] 다른 웹 페이지로 리디렉션하려면 어떻게합니까?

jQuery 또는 순수 JavaScript를 사용하여 한 페이지에서 다른 페이지로 사용자를 리디렉션하려면 어떻게해야합니까?



답변

jQuery를 사용하여 단순히 리디렉션하지는 않습니다.

jQuery는 필요하지 않으며 window.location.replace(...)HTTP 리디렉션을 가장 잘 시뮬레이션합니다.

window.location.replace(...)세션 히스토리에 원래 페이지를 유지하지 않기 window.location.href때문에 replace()사용자가 끝없는 백 버튼 사태에 빠지지 않기 때문에를 사용하는 것보다 낫습니다 .

링크를 클릭하는 사람을 시뮬레이트하려면
location.href

HTTP 리디렉션을 시뮬레이션하려면 다음을 사용하십시오. location.replace

예를 들면 다음과 같습니다.

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";

// Another method for doing redirecting with JavaScript is this:
window.location = "https://stackoverflow.com";


답변

경고 : 이 답변은 가능한 해결책으로 만 제공되었습니다. jQuery가 필요하기 때문에 분명히 최상의 솔루션 은 아닙니다 . 대신 순수한 JavaScript 솔루션을 선호하십시오.

$(location).attr('href', 'http://stackoverflow.com')


답변

페이지를 리디렉션하는 표준 “vanilla”JavaScript 방법

window.location.href = 'newPage.html';

또는 더 간단하게 : ( window글로벌 이므로 )

location.href = 'newPage.html';

당신이 있기 때문에 여기 경우 손실 리디렉션, 계속 읽어 때 HTTP_REFERER를 :

(그렇지 않으면이 마지막 부분을 무시하십시오)


다음 섹션은 HTTP_REFERER많은 보안 조치 중 하나로 사용하는 사람들을위한 것입니다 (비록 훌륭한 보호 조치는 아니지만). 당신이 사용하는 경우 인터넷 익스플로러 8 이하 자바 스크립트 페이지 리디렉션 (같이 location.href 등)의 어떤 형태를 사용하는 경우, 이러한 변수는 손실됩니다.

아래에서 우리는 IE8 이하 의 대안을 구현하여 HTTP_REFERER를 잃지 않도록합니다. 그렇지 않으면 거의 항상을 사용할 수 있습니다 window.location.href.

HTTP_REFERERURL 붙여 넣기, 세션 등을 테스트 하면 요청이 합법적인지 여부를 알 수 있습니다 .
( 참고 : 의견에 droop의 링크로 언급 된 것처럼 이러한 참조자를 해결 / 스푸핑하는 방법도 있습니다)


간단한 크로스 브라우저 테스트 솔루션 (Internet Explorer 9 이상 및 기타 모든 브라우저의 경우 window.location.href로 대체)

용법: redirect('anotherpage.aspx');

function redirect (url) {
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) {
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
    }

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else {
        window.location.href = url;
    }
}


답변

이를 수행하는 많은 방법이 있습니다.

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')


답변

이것은 모든 브라우저에서 작동합니다.

window.location.href = 'your_url';


답변

당신이하려는 일에 대해 조금 더 설명하면 도움이 될 것입니다. 페이징 된 데이터를 생성하려는 경우이를 수행하는 방법에 대한 몇 가지 옵션이 있습니다. 직접 연결하려는 각 페이지에 대해 별도의 링크를 생성 할 수 있습니다.

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

예제의 현재 페이지는 코드와 CSS에서 다르게 처리됩니다.

AJAX를 통해 페이징 된 데이터를 변경하려면 여기에서 jQuery를 사용합니다. 다른 페이지에 해당하는 각 앵커 태그에 클릭 핸들러를 추가하면됩니다. 이 클릭 핸들러는 AJAX를 통해 다음 페이지를 가져오고 새 데이터로 테이블을 업데이트하는 일부 jQuery 코드를 호출합니다. 아래 예에서는 새 페이지 데이터를 반환하는 웹 서비스가 있다고 가정합니다.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});


답변

또한 이것이 location.replace(URL)최선의 방법 이라고 생각 하지만 리디렉션에 대해 검색 엔진에 알리려면 (리디렉션을보기 위해 JavaScript 코드를 분석하지 않음) rel="canonical"메타 태그를 웹 사이트에 추가해야합니다 .

HTML 새로 고침 메타 태그가 포함 된 noscript 섹션을 추가하는 것도 좋은 해결책입니다. 이 JavaScript 리디렉션 도구 를 사용하여 리디렉션을 만드는 것이 좋습니다 . 또한 HTTP 리퍼러를 전달하기 위해 Internet Explorer를 지원합니다.

지연없는 샘플 코드는 다음과 같습니다.

<!-- Place this snippet right after opening the head tag to make it work properly -->

<!-- This code is licensed under GNU GPL v3 -->
<!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited -->
<!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ -->

<!-- REDIRECTING STARTS -->
<link rel="canonical" href="https://yourdomain.com/"/>
<noscript>
    <meta http-equiv="refresh" content="0;URL=https://yourdomain.com/">
</noscript>
<!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]-->
<script type="text/javascript">
    var url = "https://yourdomain.com/";
    if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer
    {
        document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix.
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }
    else { window.location.replace(url); } // All other browsers
</script>
<!-- Credit goes to http://insider.zone/ -->
<!-- REDIRECTING ENDS -->