Quattro opzioni di reindirizzamento: Java Script, html, php e htaccess. Reindirizzamento a un'altra pagina utilizzando JavaScript Reindirizzamento Javascript alla stessa pagina
Buona giornata, iscritti e ospiti del mio blog. Oggi voglio raccontarvi un materiale molto importante e richiesto, i cui meccanismi sono utilizzati in molti siti e servizi web. Vale a dire, spiegherò cos'è il reindirizzamento in JavaScript.
In questo post troverai molte informazioni utili sui reindirizzamenti, scopri il suo settore principale. Ti mostrerò anche come creare un reindirizzamento usando php, html e persino .htaccess. E naturalmente troverai esempi dopo ogni capitolo chiave. Ora passiamo al debriefing!
Che cos'è il reindirizzamento e per quale scopo è stato creato?
Tradotto dall'inglese redirect significa "reindirizzamento, reindirizzamento". Infatti, con l'aiuto del reindirizzamento, gli utenti vengono automaticamente reindirizzati ad altre pagine di risorse web utilizzando un ancoraggio predeterminato (link).
Ognuno di voi almeno una volta ha affrontato tali situazioni quando si accede a un sito e questo ti reindirizza alla stessa pagina, situata solo da un nuovo collegamento. Succede anche che gli utenti vengano reindirizzati ad altre pagine o annunci pubblicitari. Tutto questo viene fatto utilizzando i reindirizzamenti.
Grazie a questo meccanismo, puoi gestire in modo flessibile il reindirizzamento: impostare il passaggio a nuove pagine con un ritardo, in caso di cambio di dominio, reindirizzare l'utente a un nuovo indirizzo tramite url senza azioni aggiuntive di quest'ultimo, aprire le pagine in modo nuova scheda, organizzare un reindirizzamento in caso di inoltro non riuscito, ecc.
L'oggetto è responsabile di tali azioni in JavaScript. posizione.documento... In effetti, questo oggetto ha una serie di proprietà necessarie per ottenere informazioni complete sulla pagina web (pagina).
Per ora, parlerò di una proprietà utilizzata per reindirizzare le pagine: href. Se vuoi approfondire le tue conoscenze, cerca le informazioni nella documentazione.
Come posso implementare il reindirizzamento utilizzando document.location.href?
Così, posizione.del.documento.href contiene il percorso completo delle pagine del servizio Web. Se ora esegui la riga document.write (document.location.href) in qualsiasi editor online, riceverai un collegamento completo alla scheda in cui è stato scritto nella risposta.
Per implementare un reindirizzamento, devi solo assegnare un indirizzo diverso a questa proprietà.
Ho deciso di fare un esempio su un compito specifico, che spesso si trova tra i compiti in progetti reali.
Quindi, hai una sorta di risorsa web situata al link, ad esempio http://pfd.ru. Ma nel tempo hai acquisito un nuovo dominio più adatto e quindi il sito è stato spostato in un nuovo indirizzo: http://ddd.ru.
Poiché gli utenti sono abituati al vecchio collegamento o hanno aggiunto questo servizio ai segnalibri con il vecchio indirizzo, è necessario implementare una transizione automatica. Allo stesso tempo, è necessario implementare l'attività in modo che i clienti possano vedere le modifiche. Per fare ciò, è necessario scrivere la seguente implementazione software:
Ora il sito dell'azienda "****" si trova ad un nuovo indirizzo: http://ddd.ru... Dopo 6 secondi, verrai reindirizzato automaticamente ad esso. Se la transizione non è avvenuta automaticamente, segui il link specificato: http://ddd.ru
Come piccolo bonus, ho deciso di allegare un altro esempio di codice che contiene domande molto frequenti. A volte ci sono altre situazioni in cui, insieme al reindirizzamento, è necessario trasferire alcuni dati alla pagina aperta tramite il metodo POST. Questo meccanismo può essere implementato anche tramite js.
Il tag viene utilizzato per inviare qualsiasi informazione nel markup html
Esempio 2
Puoi mostrare un messaggio pertinente ai visitatori del tuo sito e quindi reindirizzarli a una nuova pagina. Ci vorrà un po' di tempo per caricare la nuova pagina. L'esempio seguente mostra come implementare lo stesso. Qui SetTimeout() è una funzione JavaScript incorporata che può essere utilizzata per eseguire un'altra funzione dopo un intervallo di tempo specificato.
Conclusione
Verrai reindirizzato alla home page in 10 secondi!Esempio 3
L'esempio seguente mostra come reindirizzare i visitatori del tuo sito web a una pagina diversa a seconda dei loro browser.
Esempi di reindirizzamenti o reindirizzamenti a un'altra pagina.
Reindirizzamento HTML
// Aggiorna la pagina dopo 5 secondi: // Reindirizzamento a https://www.google.com dopo 5 secondi: // Reindirizzamento immediato a https://www.google.com:Reindirizzamento JavaScript
Il metodo replace() ti consente di sostituire una pagina con un'altra in modo tale che questa sostituzione non si rifletta nella cronologia HTML del browser.
Location.replace ("https://www.google.com"); document.location.replace ("https://www.google.com");
Il metodo reload() simula completamente il comportamento del browser quando si fa clic sul pulsante di ricarica nella barra degli strumenti. Se si chiama il metodo senza un argomento o lo si specifica uguale a true, il browser verificherà l'ora dell'ultima modifica del documento e lo scaricherà dalla cache (se il documento non è stato modificato) o dal server. Questo comportamento corrisponde al clic sul pulsante di ricarica. Se specifichi false come argomento, il browser ricaricherà il documento corrente dal server. Questo comportamento corrisponde alla pressione simultanea di ricarica e del tasto Maiusc (ricarica + Maiusc).
Window.location.reload ("https://www.google.com");
Anche i seguenti esempi reindirizzeranno a Google:
Posizione = "https://www.google.com"; document.location.href = "https://www.google.com";
Utilizzando la funzione setTimeout, è possibile implementare un ritardo di reindirizzamento prima di eseguire un reindirizzamento (nell'esempio - 5 secondi):
SetTimeout ("posizione =" https://www.google.com ";", 5000);
Un semplice esempio di reindirizzamento del timer:
attendere prego 10 sec o segui questo link: https://www.google.com
Reindirizzamento PHP
Php ha una funzione header() che permette non solo di sostituire le intestazioni standard, ma anche di aggiungerne di nuove.
Sintassi:
// la stringa è una stringa di intestazione completamente formata che deve essere aggiunta (senza la nuova riga finale "\ n") // replace specifica se sostituire le intestazioni con lo stesso nome (true) o aggiungere alla fine (false) // http_response_code specifica il codice di risposta http (300, 301, 302, ecc.) void header (string string [, bool replace = true [, int http_response_code]]);
Esempi di utilizzo:
Intestazione ("Aggiorna: 0; url = / error404.html"); // reindirizza immediatamente (senza indugio) all'intestazione della pagina di errore ("Aggiorna: 5; url = https: //www.google.com/"); // reindirizza alla pagina principale di Rambler 5 secondi dopo il caricamento della pagina. intestazione ("Posizione: /", true, 307); // reindirizza alla pagina principale del sito utilizzando un reindirizzamento 307. header ("Posizione: /article/page.htm", true, 303); // usa un reindirizzamento 303 per reindirizzare alla pagina interna del sito. intestazione ("Posizione: http://google.ru/search?q=redirect"); // usa un reindirizzamento 302 per reindirizzare a una ricerca su Google per la parola reindirizzamento (quando si utilizza la posizione senza specificare un codice di reindirizzamento, l'impostazione predefinita è 302). intestazione ("Posizione: http://yandex.ru/yandsearch?text=redirect", true, 301); // reindirizza utilizzando un reindirizzamento 301 a una ricerca Yandex per la parola reindirizzamento.
Reindirizzamento HTML in PHP:
";
La seconda opzione, che ha un significato simile, ma può essere utile se l'installazione del codice e il reindirizzamento devono essere eseguiti in luoghi diversi:
Header ("HTTP / 1.1 301 spostato in modo permanente"); intestazione ("Posizione: http://site.com/");
La prima riga specifica il codice http e la seconda, infatti, specifica l'indirizzo. Nella maggior parte dei casi, non ci saranno problemi. Tuttavia, se si utilizza la modalità FastCGI, al posto di "HTTP / 1.1 301 spostato in modo permanente" potrebbe essere necessario scrivere "Stato: 301 spostato in modo permanente".
Reindirizzamento in .htaccess (RewriteEngine)
Sintassi:
Reindirizzamento URL percorso URL da reindirizzare
Lo stato del parametro opzionale è di tre cifre: il codice di reindirizzamento (ad esempio, 301). Se non specificato, il valore predefinito è 302.
URL-percorso - la parte dell'indirizzo richiesta dall'utente (o dal motore di ricerca), che deve necessariamente iniziare con una barra (/)
URL-to-redirect - indirizzo completo del sito (ed eventualmente parte del percorso) a cui verrà effettuato il reindirizzamento. Dovrebbe essere nella forma http://site.ru/, ovvero il protocollo (http: //) e la barra di chiusura (/) devono essere presenti.
Se il percorso dell'URL non termina con una barra, il reindirizzamento verrà attivato solo se l'URL richiesto dall'utente corrisponde esattamente al percorso dell'URL.
Se il percorso dell'URL termina con una barra, il reindirizzamento funzionerà non solo per l'indirizzo specificato, ma anche per tutto ciò che inizia con quello specificato. E la parte dell'indirizzo che segue l'ultima barra specificata nel percorso dell'URL verrà aggiunta all'URL di reindirizzamento.
L'azione della direttiva RedirectMatch è simile a Redirect, ma le espressioni regolari possono essere utilizzate nei parametri URL-regexp e URL-to-redirect.
// deve essere attivo affinché RewriteRule funzioni RewriteEngine su RewriteRule URL-regexp URL-to-redirect]
La direttiva RewriteRule ha una gamma più ampia di usi. Che, tra le altre possibilità, ne consente l'uso per i reindirizzamenti - con l'indicazione dei flag L (esegui immediatamente) e R (reindirizza) alla fine della riga tra parentesi quadre.
Esempi di utilizzo:
Reindirizzamento / http://yandex.ru/yandsearch?text= # Un reindirizzamento 302 (per impostazione predefinita) a una ricerca Yandex per i caratteri inseriti nella barra degli indirizzi dopo che verrà eseguito il nome del tuo sito. # Cioè, se un visitatore inserisce http: //tuo_sito.ru/page, il browser lo reindirizzerà a http://yandex.ru/yandsearch?text=page Redirect 301 /hello.html http://google.ru /cerca?q = ciao # Se vai alla pagina http: //tuo_sito.ru/ciao.html, verranno eseguiti 301 reindirizzamenti per cercare la frase "ciao" in Google. RedirectMatch (. *) \.Jpg $ http: //hosting_for_images $1.jpg # "Temporaneamente" (302 reindirizzamenti sono attivi per impostazione predefinita) reindirizza tutte le richieste di immagini jpeg a qualche hosting gratuito # o lo stesso, ma usando RewriteRule : RewriteEngine on RewriteRule (. *) \.Jpg $ http: //hosting_for_pictures $1.jpg