Jak uzyskać poprzedni adres URL w JavaScript?


230

Czy jest jakiś sposób na uzyskanie poprzedniego adresu URL w JavaScript? Coś takiego:

alert("previous url is: " + window.history.previous.href);

Czy jest coś takiego? Czy powinienem po prostu przechowywać go w pliku cookie? Muszę tylko wiedzieć, że mogę robić przejścia z poprzedniego adresu URL na bieżący adres URL bez kotwic i tak dalej.

Odpowiedzi:


351
document.referrer

w wielu przypadkach otrzymasz adres URL ostatniej strony, którą odwiedził użytkownik, jeśli dotarł do bieżącej strony poprzez kliknięcie linku (zamiast wpisywania bezpośrednio w pasku adresu lub, w niektórych przypadkach, wierzę, przesyłając formularz?). Określone przez DOM poziom 2 . Więcej tutaj.

window.historyumożliwia nawigację, ale nie ma dostępu do adresów URL w sesji ze względów bezpieczeństwa i prywatności. Jeśli dostępna była bardziej szczegółowa historia adresów URL, każda odwiedzana witryna mogłaby zobaczyć wszystkie inne witryny, w których byłaś.

Jeśli masz do czynienia ze stanem poruszania się po własnej witrynie, być może jest to mniej kruche i na pewno bardziej przydatne użycie jednej z normalnych technik zarządzania sesjami: danych cookie, parametrów adresu URL lub informacji o sesji po stronie serwera.


4
Istnieje również document.referrer, jeśli dotarłeś do bieżącej strony za pomocą linku (ale nie na przykład przez dodanie zakładki lub wpisanie w pasku adresu).
— Hellion,

68
w końcu zapisałem poprzedni adres URL w plikach cookie witryny, document.referrernie zawsze działa. $.cookie("previousUrl", window.location.href, {path:"/"});.
— Lance Pollard

4
Uratowałeś mnie od świata bólu JavaScript!
— Anna Lam

8
poprzedni nie jest polecającym. nie pomyl ich
— Green

1
document.referrer nie zapisuje skrótów od ostatniego adresu URL ... odnosi się tylko do ostatniego adresu URL.
— Nmaster88

29

Jeśli chcesz przejść do poprzedniej strony bez znajomości adresu URL, możesz użyć nowego interfejsu API historii.

history.back(); //Go to the previous page
history.forward(); //Go to the next page in the stack
history.go(index); //Where index could be 1, -1, 56, etc.

Ale nie można manipulować zawartością stosu historii w przeglądarce, która nie obsługuje interfejsu API historii HTML5

Aby uzyskać więcej informacji, zobacz dokument


2
Jak to zrobić, znając adres URL, href = ''?
— summu

@summu jest przechowywany w samej przeglądarce
— Ahmed Taha

20

document.referrer nie jest taki sam jak rzeczywisty adres URL we wszystkich sytuacjach.

Mam aplikację, w której muszę ustalić zestaw ramek z 2 ramkami. Jedna ramka jest znana, druga to strona, z której prowadzę link. Wydaje się, że document.referrerbyłoby to idealne, ponieważ nie trzeba przekazywać rzeczywistej nazwy pliku do dokumentu zestawu ramek.

Jeśli jednak później zmienisz stronę dolnej ramki, a następnie użyjesz history.back()jej, nie ładuje oryginalnej strony do dolnej ramki, zamiast tego ładuje się ponowniedocument.referrer się ponownie, w wyniku czego zestaw ramek zniknął i wrócisz do pierwotnego okna początkowego.

Zajęło mi to trochę czasu, aby to zrozumieć. Tak więc w tablicy historii document.referrernie jest tylko adresem URL, najwyraźniej jest to również specyfikacja okna strony odsyłającej. Przynajmniej w tym momencie najlepiej to rozumiem.


Począwszy od mojego ostatniego testowania „document.referrer”, teraz po prostu zwracam nazwę domeny, a nie pełny adres URL, aby uniknąć śledzenia.
— Akash Kumar Seth,

12

Jeśli piszesz aplikację internetową lub aplikację jednostronicową (SPA), w której routing odbywa się w aplikacji / przeglądarce, a nie w obie strony na serwerze, możesz wykonać następujące czynności:

window.history.pushState({ prevUrl: window.location.href }, null, "/new/path/in/your/app")

Następnie na nowej trasie możesz wykonać następujące czynności, aby pobrać poprzedni adres URL:

window.history.state.prevUrl // your previous url

0

Użytkownicy korzystający z Node.js i Express mogą ustawić sesyjny plik cookie, który zapamięta bieżący adres URL strony, umożliwiając w ten sposób sprawdzenie strony odsyłającej przy następnym ładowaniu strony. Oto przykład wykorzystujący express-sessionoprogramowanie pośrednie:

//Add me after the express-session middleware    
app.use((req, res, next) => {
    req.session.referrer = req.protocol + '://' + req.get('host') + req.originalUrl;
    next();
});

Następnie możesz sprawdzić, czy istnieje plik cookie odsyłający, taki jak:

if ( req.session.referrer ) console.log(req.session.referrer);

Nie zakładaj, że plik cookie strony odsyłającej zawsze istnieje w tej metodzie, ponieważ nie będzie dostępny w przypadkach, gdy poprzedni adres URL był inną witryną, sesja została wyczyszczona lub właśnie została utworzona (ładowanie strony po raz pierwszy).


0
<script type="text/javascript">
    document.write(document.referrer);
</script>

document.referrer spełnia twoje zadanie, ale nie działa dla wersji Internet Explorera wcześniejszych niż IE9.

Będzie działał dla innych popularnych przeglądarek, takich jak Chrome, Mozilla, Opera, Safari itp.


Działa w IE 9 dla mnie
— frodo2975,

-8

Spowoduje to przejście do poprzednio odwiedzanego adresu URL.

javascript:history.go(-1)

1
OP poprosił o to, jak dostać się do poprzedniego adresu URL
— Matt Jensen,
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.