Frage Wie kann ich auf eine andere Webseite umleiten?


Wie kann ich den Benutzer mithilfe von jQuery oder reinem JavaScript von einer Seite auf eine andere umleiten?


7738
2018-02-02 12:54


Ursprung


Antworten:


Man leitet nicht einfach mit jQuery um

jQuery ist nicht notwendig, und window.location.replace(...) simuliert am besten eine HTTP-Weiterleitung.

window.location.replace(...) ist besser als verwenden window.location.href, weil replace() Die ursprüngliche Seite wird nicht im Sitzungsverlauf gespeichert, was bedeutet, dass der Benutzer nicht in einem nie endenden Zurück-Knopf-Fiasko steckenbleibt.

Wenn Sie jemanden simulieren möchten, der auf einen Link klickt, verwenden Sie    location.href

Wenn Sie eine HTTP-Weiterleitung simulieren möchten, verwenden Sie location.replace

Beispielsweise:

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";

12915
2018-02-03 04:24



WARNUNG: Diese Antwort wurde lediglich als eine mögliche Lösung zur Verfügung gestellt; es ist offensichtlich nicht die beste Lösung, da es jQuery benötigt. Stattdessen bevorzugen Sie die reine JavaScript-Lösung.

$(location).attr('href', 'http://stackoverflow.com')

1472
2017-10-28 16:35



Standard "Vanille" JavaScript Weg um eine Seite umzuleiten:

window.location.href = 'newPage.html';


Wenn du hier bist, weil du es bist zu verlieren HTTP_REFERER beim Umleiten, lesen Sie weiter:


Der folgende Abschnitt ist für diejenigen, die verwenden HTTP_REFERER als eine von vielen sicheren Maßnahmen (obwohl es keine große Schutzmaßnahme ist). Wenn du es benutzt Internet Explorer 8 oder niedriger, diese Variablen gehen verloren, wenn Sie irgendeine Form von JavaScript-Seitenumleitung (location.href, etc.) verwenden.

Im Folgenden werden wir eine Alternative für IE8 & niedriger damit wir HTTP_REFERER nicht verlieren. Ansonsten kann man fast immer einfach verwenden window.location.href.

Testen gegen HTTP_REFERER (URL-Einfügen, Sitzung usw.) kann hilfreich sein, um zu sagen, ob eine Anfrage legitim ist. (Hinweis: es gibt auch Möglichkeiten, diese Referrer zu umgehen / zu verfälschen, wie es in den Kommentaren durch den Link von droop festgestellt wurde.


Einfache browserübergreifende Testlösung (Fallback für window.location.href für Internet Explorer 9+ und alle anderen Browser)

Verwendung: redirect('anotherpage.aspx');

function redirect (url) {
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) {
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
    }

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else { 
        window.location.href = url; 
    }
}

508
2017-07-27 14:41



Benutzen:

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

349
2018-01-28 04:28



Dies funktioniert für jeden Browser:

window.location.href = 'your_url';

269
2017-10-22 23:45



Es würde helfen, wenn Sie etwas beschreibender wären in dem, was Sie zu tun versuchen. Wenn Sie versuchen, seitenweise Daten zu generieren, gibt es einige Möglichkeiten, wie Sie dies tun. Sie können separate Links für jede Seite generieren, auf die Sie direkt zugreifen können.

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

Beachten Sie, dass die aktuelle Seite in diesem Beispiel im Code und mit CSS anders behandelt wird.

Wenn Sie möchten, dass die ausgelagerten Daten über AJAX geändert werden, kommt jQuery hier ins Spiel. Sie würden jedem Anker-Tag, der einer anderen Seite entspricht, einen Click-Handler hinzufügen. Dieser Click-Handler würde einen bestimmten jQuery-Code aufrufen, der die nächste Seite über AJAX holt und die Tabelle mit den neuen Daten aktualisiert. Im folgenden Beispiel wird davon ausgegangen, dass Sie über einen Webdienst verfügen, der die neuen Seitendaten zurückgibt.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});

253
2018-02-02 13:18



ich denke das auch location.replace(URL) ist der beste Weg, aber wenn Sie die Suchmaschinen über Ihre Umleitung benachrichtigen wollen (sie analysieren JavaScript-Code nicht, um die Umleitung zu sehen), sollten Sie das hinzufügen rel="canonical" Meta-Tag für Ihre Website.

Das Hinzufügen eines Noscript-Abschnitts mit einem HTML-Aktualisierungsmetatag ist ebenfalls eine gute Lösung. Ich empfehle Ihnen, dies zu benutzen JavaScript-Umleitungstool Umleitungen zu erstellen. Es hat auch Internet Explorer-Unterstützung, um den HTTP-Referrer zu übergeben.

Beispielcode ohne Verzögerung sieht folgendermaßen aus:

<!-- Place this snippet right after opening the head tag to make it work properly -->

<!-- This code is licensed under GNU GPL v3 -->
<!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited -->
<!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ -->

<!-- REDIRECTING STARTS -->
<link rel="canonical" href="https://yourdomain.com/"/>
<noscript>
    <meta http-equiv="refresh" content="0;URL=https://yourdomain.com/">
</noscript>
<!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]-->
<script type="text/javascript">
    var url = "https://yourdomain.com/";
    if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer
    {
        document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix.
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }
    else { window.location.replace(url); } // All other browsers
</script>
<!-- Credit goes to http://insider.zone/ -->
<!-- REDIRECTING ENDS -->

215
2018-04-25 10:12



Wenn jemand jedoch zurück zur Startseite umleiten möchte, kann er das folgende Snippet verwenden.

window.location = window.location.host

Es wäre hilfreich, wenn Sie drei verschiedene Umgebungen wie Entwicklung, Bereitstellung und Produktion haben.

Sie können dieses Fenster oder window.location-Objekt durchsuchen, indem Sie diese Wörter einfach in die Chrome-Konsole einfügen oder Feuerwanze's Konsole.


191
2017-10-30 12:15



JavaScript bietet Ihnen viele Methoden zum Abrufen und Ändern der aktuellen URL, die in der Adressleiste des Browsers angezeigt wird. Alle diese Methoden verwenden das Location-Objekt, das eine Eigenschaft des Window-Objekts ist. Sie können ein neues Location-Objekt mit der aktuellen URL wie folgt erstellen.

var currentLocation = window.location;

Grundstruktur einer URL

<protocol>//<hostname>:<port>/<pathname><search><hash>

enter image description here

  1. Protokoll - Gibt den Protokollnamen an, der für den Zugriff auf die Ressource im Internet verwendet werden soll. (HTTP (ohne SSL) oder HTTPS (mit SSL))

  2. Hostname - Hostname gibt den Host an, der die Ressource besitzt. Zum Beispiel www.stackoverflow.com. Ein Server stellt Dienste bereit, die den Namen des Hosts verwenden.

  3. Port - Eine Portnummer, die zur Erkennung eines bestimmten Prozesses verwendet wird, an den eine Internet- oder andere Netzwerknachricht weitergeleitet werden soll, wenn sie bei einem Server ankommt.

  4. Pfadname - Der Pfad gibt Informationen über die spezifische Ressource innerhalb des Hosts, auf den der Webclient zugreifen möchte. Zum Beispiel stackoverflow.com/index.html.

  5. query - Eine Abfragezeichenfolge folgt der Pfadkomponente und stellt eine Reihe von Informationen bereit, die die Ressource für bestimmte Zwecke verwenden kann (z. B. als Parameter für eine Suche oder als zu verarbeitende Daten).

  6. hash - Der Ankerbereich einer URL enthält das Hash-Zeichen (#).

Mit diesen Standortobjekteigenschaften können Sie auf alle diese URL-Komponenten zugreifen

  1. Hash   - Legt den Ankerbereich einer URL fest oder gibt ihn zurück.
  2. Gastgeber   -Sets oder gibt den Hostnamen und den Port einer URL zurück.
  3. Hostname   -Sets oder Gibt den Hostnamen einer URL zurück.
  4. href   -Sets oder gibt das gesamte zurück URL
  5. Pfadname   - Legt den Pfadnamen einer URL fest oder gibt diesen zurück.
  6. Hafen - Legt die Portnummer fest, die der Server für eine URL verwendet.
  7. Protokoll   - Legt das Protokoll einer URL fest oder gibt es zurück.
  8. Suche   -Sets oder gibt den Abfrageteil einer URL zurück

Wenn Sie nun eine Seite ändern oder den Benutzer auf eine andere Seite umleiten möchten, können Sie die href Eigenschaft des Location-Objekts wie folgt

Sie können die href-Eigenschaft des Location-Objekts verwenden.

window.location.href = "http://www.stackoverflow.com";

Standortobjekt haben auch diese drei Methoden

  1. zuordnen() - Lädt ein neues Dokument.
  2. neu laden() - Lädt das aktuelle Dokument neu.
  3. ersetzen() - Ersetzt das aktuelle Dokument durch ein neues

Sie können die Methoden assign () und replace verwenden, um auch auf andere Seiten wie diese umzuleiten

location.assign("http://www.stackoverflow.com");

location.replace("http://www.stackoverflow.com");

Wie sich assign () und replace () unterscheiden- Der Unterschied zwischen der Methode replace () und assign () () besteht darin, dass replace () die URL des aktuellen Dokuments aus der Dokumentenhistorie entfernt, dh es ist nicht möglich, mit der Schaltfläche "Zurück" zurück zu navigieren das Originaldokument. Verwenden Sie also die assign () -Methode, wenn Sie ein neues Dokument laden möchten und die Möglichkeit haben möchten, zum ursprünglichen Dokument zurückzukehren.


183
2017-12-23 13:35



Sollte nur mit einstellen können window.location.

Beispiel:

window.location = "https://stackoverflow.com/";

Hier ist ein früherer Beitrag zum Thema:

Wie kann ich auf eine andere Webseite umleiten?


166
2018-02-16 14:42