[facebook] Facebook 및 새 Twitter URL의 shebang / hashbang (#!)은 무엇입니까?

octothorpe / number-sign / hashmark는 URL에 특별한 의미가 있으며 일반적으로 문서의 섹션 이름을 식별합니다. 정확한 용어는 해시 뒤의 텍스트 가 URL 의 앵커 부분이라는 것입니다. Wikipedia를 사용하면 대부분의 페이지에 목차가 있으며 다음과 같이 앵커가있는 문서 내의 섹션으로 이동할 수 있습니다.

https://ko.wikipedia.org/wiki/Alan_Turing#Early_computers_and_the_Turing_test

https://en.wikipedia.org/wiki/Alan_Turing페이지를 식별하고 Early_computers_and_the_Turing_test앵커입니다. Facebook 및 기타 Javascript 기반 응용 프로그램 (예 : 내 Wood & Stones )이 앵커를 사용하는 이유 는 페이지에서 전체 페이지를 다시로드하지 않고 페이지를 책갈피 가능 (응답에 대한 의견에서 제안한대로)하거나 뒤로 단추 를 지원하기 를 원하기 때문입니다. 서버 .

북마크 및 뒤로 버튼을 지원하려면 URL을 변경해야합니다. 그러나 페이지 부분 (와 같은 window.location = 'http://raganwald.com';)을 다른 URL로 변경하거나 앵커를 지정하지 않으면 브라우저는 URL에서 전체 페이지를로드합니다. Firebug 또는 Safari의 Javascript 콘솔에서 시도하십시오. 로드 http://minimal-github.gilesb.com/raganwald. 이제 자바 스크립트 콘솔에서 다음을 입력하십시오.

window.location = 'http://minimal-github.gilesb.com/raganwald';

서버에서 페이지를 새로 고칩니다. 이제 다음을 입력하십시오.

window.location = 'http://minimal-github.gilesb.com/raganwald#try_this';

아하! 페이지 새로 고침이 없습니다! 유형:

window.location = 'http://minimal-github.gilesb.com/raganwald#and_this';

여전히 새로 고침이 없습니다. 뒤로 단추를 사용하여 이러한 URL이 브라우저 히스토리에 있는지 확인하십시오. 브라우저는 우리가 같은 페이지에 있지만 앵커를 변경하기 만하면 다시로드되지 않습니다. 이 동작 덕분에 브라우저에 하나의 ‘페이지’에있는 것처럼 보이지만 뒤로 버튼을 존중하는 책갈피 가능한 섹션이 많은 단일 Javascript 애플리케이션을 가질 수 있습니다. 응용 프로그램은 사용자가 다른 ‘상태’를 입력 할 때 앵커를 변경해야하며, 마찬가지로 사용자가 뒤로 단추 나 책갈피 또는 링크를 사용하여 앵커가 포함 된 응용 프로그램을로드하는 경우 응용 프로그램은 적절한 상태를 복원해야합니다.

앵커는 Javascript 프로그래머에게 책갈피 작성 가능하고 색인 작성 가능하며 뒤로 단추 친화적 인 응용 프로그램을 만들 수있는 메커니즘을 제공합니다. 이 기술의 이름은 단일 페이지 인터페이스 입니다.

ps이 기법에는 네 번째 이점이 있습니다. AJAX를 통해 페이지 컨텐츠를로드 한 다음 현재 DOM에 삽입하는 것이 새 페이지를로드하는 것보다 훨씬 빠릅니다. 속도 증가에 더하여, 백그라운드에서 특정 부분을 로딩하는 것과 같은 추가 트릭은 프로그래머의 제어하에 수행 될 수있다.

pps이 모든 것을 감안할 때, ‘bang’또는 느낌표는 Google 웹 크롤러에게 서버에서 약간 다른 URL로 동일한 페이지를로드 할 수 있다는 추가 힌트입니다. Ajax 크롤링을 참조하십시오 . 또 다른 기술은 각 링크가 서버 액세스 가능한 URL을 가리 키도록하고 눈에 거슬리지 않는 자바 스크립트를 사용하여 앵커가있는 SPI로 변경하는 것입니다.

주요 링크는 다음과 같습니다 . 단일 페이지 인터페이스 선언

---

답변