2013-08-20 3 views
1

도메인의 하위 경로로 이동하는 경우 일반적인 방법은 <a href="/somepath">Some Path</a>입니다. 이렇게하면 페이지가 완전히 다시로드됩니다.페이지를 새로 고침하지 않고 다른 URL로 이동

하지만 Facebook에서 사진을 열면 주소 표시 줄의 URL이 변경되지만 전체 페이지가 다시로드되지 않고 사진 플랫폼 만로드됩니다. 이렇게 사람들은 사진의 URL을 공유 할 수있다. 이게 어떻게 이루어 졌는지 궁금하네요?

일부 검색을 수행했지만 일부 사람들은 history.pushState을 사용하여 제안했지만 대부분의 최신 브라우저에서만 작동합니다. 페이스 북에서도 IE 7에서 작동합니다. 어떻게 작동하는지 궁금합니다.

답변

2

history.pushStatemodern browsers (noteably IE>=10)에서만 사용 가능합니다.

오래된 브라우저의 경우 URL을 변경하는 방법은 URL에서 해시 기능을 사용/악용하여 페이지 정보를 유지하는 것입니다.이 방법을 사용하여 URL을 변경하는 유일한 방법은 "hashbang" technique입니다. 그런 다음 index.php#!page=x&foo=bar과 비슷한 URL로 끝나고 여기서 해시는 현재 페이지를 나타내는 데 사용됩니다. 그런 다음 URL은 index.php?page=x&foo=bar과 같은 링크로 일대일로 매핑되며 페이지를 새로 고칠 때 JavaScript는 해시를 다시 읽고 페이지를 적절히 표시 할 수 있습니다. 그것은 결코 훌륭한 해결책이 아니 었습니다. 특히 브라우저가 기록을 올바르게 저장하지 못했지만 여전히 인기가있었습니다.

당신은 페이지를 다시로드하고 동시에 URL을 변경, 사용 가능한 경우 시도 할 것이다 History.js/ AjaxifypushState을 사용하는 등 아마도 라이브러리로 보이지만, hashbangs를 사용하여 다시 가을 Ajax를 사용하고자하는 경우 어디로 가야하는지.

facebook이 Ajax for Legacy IE를 지원한다고 생각하는 것 같습니다. 저는 IE7이 매우 자주 방문하는 브라우저라고 말할 수는 없지만 IIRC Twitter는 기능이 부족한 구형 브라우저를 사용하는 데 훨씬 적은 시간을 할애 해 훨씬 단순화 된 인터페이스로 돌아갑니다 (I 그것도 기본 모바일보기를 사용하여 생각). 내 웹 사이트라면 비슷한 태도를 취하고 가능하다면 pushState을 사용하고 어디서나 독립형 페이지를 제공하기 만하면됩니다. 이러한 영역에서 이전 버전과의 호환성에 대한 작업은 상당히 어려울 경향이 있습니다 (위에서 언급 한 플러그인은 상당히 많은로드가 걸리 겠지만). 지원을 제공 할 필요가 없다면 어쩌면 가치가 없을 수도 있습니다.

모르겠어요
0

, 페이스 북은 그것을 어떻게,하지만 당신은 당신이 볼 수 Backbone.JS의 "라우팅"장에 보면,이 아직 역사의 API를 지원하지 않는 브라우저의 경우

의 라우터는 URL의 조각 버전에 대한 우아한 폴백 및 투명한 변환을 처리합니다.

그리고 당신은 더 찾을 경우 소스 코드가 말한다는 :

// Backbone.History 
// ---------------- 
// Handles cross-browser history management, based on either 
// [pushState](http://diveintohtml5.info/history.html) and real URLs, or 
// [onhashchange](https://developer.mozilla.org/en-US/docs/DOM/window.onhashchange) 
// and URL fragments. If the browser supports neither (old IE, natch), 
// falls back to polling. 

onhashchange에 언급 된 기사입니다. 아마도 그럴 수 있습니다.

관련 문제