Thực hiện các liên kết như Twitter, Hash-Bang #! URL của

Question

thể trùng lặp:
What’s the shebang/hashbang (#!) in Facebook and new Twitter URLs for?

tôi đã tự hỏi như thế nào Twitter trình liên kết của nó.

Nếu bạn nhìn vào mã nguồn, bạn sử dụng các liên kết được thực hiện như/#!/I/connect hoặc/#!/I/discover, nhưng chúng không có hàm JavaScript kèm theo chúng như tải ('kết nối') hoặc một cái gì đó và không yêu cầu tải lại trang. Nó chỉ thay đổi nội dung trang.

Tôi đã xem trang this, nhưng sau đó tất cả các tệp đó sẽ phải tồn tại và bạn không thể đi thẳng đến một trong số chúng. Tôi tưởng tượng rằng trên Twitter, mỗi tệp không tồn tại và nó được xử lý bằng một số phương pháp khác. Xin vui lòng sửa tôi nếu tôi là sai, mặc dù.

Có cách nào tôi có thể nhân rộng hiệu ứng này không? Nếu có, có hướng dẫn về cách thực hiện việc này không?

Answer 1

"Hash-Bang" chuyển hướng, vì nó đôi khi được gọi, ...

http://whatever.com/path/to/#!/some-ajax-state 

... là một giải pháp tạm thời cho một vấn đề tạm thời mà là nhanh chóng trở thành một vấn đề không nhờ vào hiện đại tiêu chuẩn trình duyệt. Trong mọi khả năng, Twitter sẽ loại bỏ nó, như Facebook đã làm.

Nó là sự kết hợp của một số khái niệm ...

Trong quá khứ, một liên kết phục vụ hai mục đích: Nó tải một tài liệu mới và/hoặc cuộn xuống một neo nhúng như được chỉ ra với băm (#).

http://whatever.com/script.php#fourth-paragraph 

Mọi thứ trong URL sau khi băm không được yêu cầu từ máy chủ nhưng được tìm kiếm trong trang của trình duyệt. Tất cả điều này vẫn hoạt động tốt.

Với việc chấp nhận AJAX, nội dung mới có thể được tải vào trang hiện tại (đã được tải). Với tải động này, một số vấn đề phát sinh: 1) không có URL duy nhất để đánh dấu trang hoặc liên kết đến nội dung mới này, 2) tìm kiếm sẽ không bao giờ nhìn thấy nó.

Một số người thông minh đã giải quyết vấn đề đầu tiên bằng cách sử dụng hàm băm như một loại tham chiếu "trạng thái" để được bao gồm trong các liên kết & dấu trang. Sau khi tải tài liệu, trình duyệt đọc băm và chạy các yêu cầu AJAX, hiển thị trang cộng với các thay đổi AJAX động của nó.

http://whatever.com/script.php#some-ajax-state 

này đã giải quyết được vấn đề AJAX, nhưng động cơ vấn đề tìm kiếm vẫn tồn tại. Công cụ tìm kiếm không tải trang và thực thi Javascript như trình duyệt.

Google để giải cứu. Google đã đề xuất một chương trình mà bất kỳ URL nào có hàm băm (#!) Thay vì chỉ một băm (#) sẽ gợi ý cho bot tìm kiếm rằng có một URL thay thế để lập chỉ mục, liên quan đến biến "_escaped_fragment_" nhiều thứ. Đọc về nó ở đây ...

https://developers.google.com/webmasters/ajax-crawling/docs/getting-started

Ngày nay, với việc thông qua javascript của pushstate trong hầu hết các trình duyệt chính, tất cả điều này đang trở nên lỗi thời. Với pushstate, vì nội dung được tải động hoặc thay đổi, URL trang hiện tại có thể được thay đổi mà không gây tải trang. Khi muốn, điều này cung cấp một URL hoạt động thực tế cho các dấu trang lịch sử &. Liên kết sau đó có thể được thực hiện như thường lệ, mà không cần băm & hash-bangs.

Tính đến hôm nay, nếu bạn tải Facebook trong trình duyệt cũ hơn, bạn sẽ thấy băm-bang, nhưng trình duyệt hiện tại sẽ chứng minh việc sử dụng pushstate.

Answer 2

Bạn có thể muốn xem thêm trên Unique URLs.

Đang tải trang qua AJAX và phân tích cú pháp "băm" (giá trị sau "#") để xác định trang nào sẽ tải. Ngoài ra, phương pháp này được sử dụng do tính chất mà các yêu cầu AJAX không được tính vào lịch sử của trình duyệt, do đó, "nút quay lại". Tuy nhiên, trình duyệt tuy nhiên lưu trữ vào lịch sử thay đổi băm.

Sử dụng băm cùng với thực tế là bạn có thể sử dụng băm để xác định các trang, bạn có thể nói rằng bạn có thể giữ các trang yêu cầu AJAX "trong lịch sử". Thêm vào đó, các URL băm chỉ là các URL, và chúng có thể đánh dấu được bao gồm cả băm, vì vậy bạn cũng có thể đánh dấu các trang yêu cầu AJAX.