Cách đối phó với trang mới với JS History API pushState

Question

Một trang web nhỏ mà tôi đã tạo (giống như không quan trọng) sử dụng AJAX để tải từng trang. Trước đây tôi đã thay đổi mã băm của url, điều này làm việc rất lớn nhưng lại xấu xí và người dùng có thể làm mới trang và nó sẽ nằm trên cùng một trang.

Bây giờ tôi đã chuyển sang sử dụng pushState trong API lịch sử JS, trông có vẻ tốt hơn, và công việc quay lại và tiến, nhưng làm mới thì không. Ví dụ:

Đi tới: http://example.com/page2 chuyển đến 404 vì không có trang thực được gọi là trang 2. Nhưng nếu tôi nhấp vào nút sử dụng phương pháp pushState để thay đổi url, nó hoạt động như bình thường.

Làm cách nào để cho phép làm mới và liên kết cố định với API lịch sử mới?

(Và cách các công cụ tìm kiếm xử lý việc này, khi Google phải tạo ra cách lập chỉ mục các url băm, bằng cách làm cho nhà phát triển chuyển sang #!, liệu họ có thể làm điều tương tự cho api lịch sử trong tương lai không?)

Answer 1

Bạn không nên sử dụng pushState để thúc đẩy các URL không hợp lệ. Nó có nghĩa là để được sử dụng trong trường hợp trang web hoạt động cả khi có và không có AJAX - tức là bạn đẩy URL sẽ dẫn đến kết quả tương tự mà không có AJAX khi tạo đầu ra này bằng AJAX.

Nếu bạn chỉ muốn URL ảo (như trong giai đoạn tiền đẩy trước), hãy tiếp tục sử dụng thẻ băm.

Answer 2

Tôi phải chuyển hướng lỗi 404 đến trang chủ trang web (trang tải các yêu cầu AJAX), sau đó lấy thành phần cuối cùng của URL và chạy hàm javascript tải trang bằng cách sử dụng yêu cầu AJAX. Không phải là một giải pháp tuyệt vời nhưng nó có vẻ hoạt động tốt.

Answer 3

Đây là câu hỏi hơi cũ nhưng đó là một trong những kết quả hàng đầu của google. Trong việc theo đuổi được hữu ích, đây là giải pháp của tôi.

Bạn có thể sử dụng Mod_Rewrite của Apache để ghi đè url vào vị trí trung tâm. Ví dụ: example.com/p2 lấy nội dung trang từ example.com/index.php?page=p2 Bạn có thể tiếp tục triển khai API lịch sử và AJAX hiện tại để nhận nội dung và bao gồm nội dung sau trong đó. htaccess

<ifModule mod_rewrite.c> 
    RewriteEngine On 
    RewriteRule ^([^/\.]+)/?$ index.php?page=$1&full=1 [L] 
</ifModule> 

Trong index.php của bạn:

<?php 
    if(isset($_GET['full']) { 
    //Generate the full page here 
    }else{ 
    //Generate just the content for AJAX 
    } 
?> 

This Page là một mồi tốt về việc sử dụng mod_rewrite để chuyển hướng toàn bộ trang web. (Nhận xét 11 & 13 cũng có các bổ sung hữu ích)