Pytanie Jak poradzić sobie z odświeżaniem strony za pomocą interfejsu PushState interfejsu JS History


Mała strona internetowa, którą tworzyłem (bardziej przypominająca skrzypce), wykorzystuje AJAX do ładowania każdej strony. Wcześniej zmieniałem hash adresu URL, działało to świetnie, ale było brzydkie, a użytkownik mógł odświeżyć stronę i pozostanie na tej samej stronie.

Teraz przełączyłem się na używanie pushState w interfejsie JS History API, który wygląda o wiele lepiej, a praca wstecz i do przodu, ale odświeżanie nie działa. Na przykład:

Zamierzam: http://example.com/page2 przechodzi do 404, ponieważ nie ma prawdziwej strony o nazwie strona 2. Ale jeśli kliknę przycisk, który używa metody pushState, aby zmienić adres URL, działa tak, jak powinien.

W jaki sposób można zezwolić na odświeżanie i permalinki za pomocą nowego interfejsu historii?

(I jak to traktują wyszukiwarki, ponieważ Google musiał stworzyć sposób indeksowania hashów, zmieniając program na #!, czy jest możliwe, że zrobią coś podobnego do historii api w przyszłości?)


21
2018-05-09 20:50


pochodzenie




Odpowiedzi:


Nie powinieneś używać pushState w ogóle wypychać nieprawidłowe adresy URL. Jest przeznaczony do użycia w przypadkach, gdy witryna działa zarówno z AJAX, jak i bez niego - tzn. Naciskasz adres URL, który przy tworzeniu tego wyniku z AJAX skutkowałby takim samym wyjściem bez AJAX.

Jeśli chcesz tylko wirtualne adresy URL (np. W erze pre-pushState), używaj tagu hash.


18
2018-05-09 23:11





To trochę stare pytanie, ale było to jedno z najlepszych wyników w Google. W pogoni za byciem pomocnym, oto moje rozwiązanie.

Możesz użyć Mod_Rewrite Apache, aby przepisać adres URL do centralnej lokalizacji. Na przykład: example.com/p2 pobiera zawartość strony z example.com/index.php?page=p2 Możesz zachować aktualną implementację interfejsu History API i AJAX, aby uzyskać zawartość i uwzględnić następujące elementy w .htaccess

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

W twoim index.php:

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

Ta strona jest dobrym podkładem przy użyciu mod_rewrite do przekierowania całej witryny. (Komentarze 11 i 13 również mają użyteczne dodatki)


8
2017-12-05 22:02





Musiałem przekierować 404 błędy na stronę główną witryny (tę, która ładuje żądania AJAX), a następnie pobrać ostatni komponent adresu URL i uruchomić funkcję javascript, która ładuje stronę za pomocą żądania AJAX. Nie jest to świetne rozwiązanie, ale wygląda na to, że działa dobrze.


2
2018-05-09 22:26