[javascript] 페이지를 다시로드하지 않고 URL 수정


Answers

HTML5에는 history.pushState()history.replaceState() 메소드가 추가되어 이력 항목을 각각 추가 및 수정할 수 있습니다.

window.history.pushState('page2', 'Title', '/page2.php');

이것에 대한 자세한 내용은 here 에서 읽어보십시오.

Question

페이지를 다시로드하지 않고 현재 페이지의 URL을 수정할 수있는 방법이 있습니까?

가능한 경우 # hash 앞에 있는 부분에 액세스하려고합니다.

도메인 의 부분 만 변경하면되므로 도메인 간 정책을 위반하는 것과 같지 않습니다.

 window.location.href = "www.mysite.com/page2.php";  // sadly this reloads






HTML5 이전에는 다음을 사용할 수 있습니다.

parent.location.hash = "hello";

과:

window.location.replace("http:www.example.com");

이 메소드는 페이지를 다시로드하지만 HTML5는 history.pushState(page, caption, replace_url) 다시로드하지 않아야하는 history.pushState(page, caption, replace_url) 를 도입했습니다.




다음은 페이지를 다시로드하지 않고 URL을 변경하는 기능입니다. HTML5 만 지원합니다.

  function ChangeUrl(page, url) {
        if (typeof (history.pushState) != "undefined") {
            var obj = {Page: page, Url: url};
            history.pushState(obj, obj.Page, obj.Url);
        } else {
            window.location.href = "homePage";
            // alert("Browser does not support HTML5.");
        }
    }

  ChangeUrl('Page1', 'homePage');



url을 변경하려고하지만 브라우저 기록에 항목을 추가하지 않으려는 경우 HTML5 replaceState를 사용할 수도 있습니다.

if (window.history.replaceState) {
   //prevents browser from storing history with each change:
   window.history.replaceState(statedata, title, url);
}

이렇게하면 뒤로 버튼 기능이 중단됩니다. 이는 이미지 갤러리와 같은 일부 인스턴스에서 필요할 수 있습니다 (뒤로 버튼이 갤러리 인덱스 페이지로 돌아가는 대신보기 이미지 각각을 통해 뒤로 이동해야 함). 각 이미지에 고유 한 URL을 제공합니다.




악의있는 일을하려고하지 않는다고 가정 할 때, 자신의 URL로하고 싶은 일은 htaccess 와 함께 할 수 있습니다.




URL 조각을 변경하는 것이 아니라면 loong ( window.location 또는 document.location )을 변경하면 해당 새 URL에 대한 요청이 발생합니다. URL을 변경하면 URL이 변경됩니다.

현재 사용중인 URL이 마음에 들지 않으면 Apache의 mod_rewrite 와 같은 서버 측 URL 재 작성 기술을 사용하십시오.




여기 내 해결책은 다음과 같습니다 (newUrl은 현재 URL을 대체하려는 새로운 URL입니다)

history.pushState({}, null, newUrl);



HTML 5 History API의 history.pushState() 사용

자세한 내용은 링크를 참조하십시오. HTML5 기록 API




Links