Potresti aver sentito parlare di cookie, ma cosa sono esattamente e cosa possiamo effettivamente fare con loro? In questo tutorial, ci concentreremo sulle basi dei cookie e impareremo le loro funzionalità in varie applicazioni web e ambienti del sito. Impareremo anche come utilizzarli nei nostri progetti PHP e JavaScript, prestando particolare attenzione ai problemi di sicurezza che potrebbero sorgere durante l'utilizzo. Dopo aver letto questo, avrai acquisito le competenze necessarie per implementare i cookie in sicurezza nelle tue applicazioni web.
Il primo passo del nostro viaggio è scoprire quali sono effettivamente questi cookie! Anche se hai già lavorato con loro, potresti comunque trovare questa parte abbastanza utile, quindi resta con me!
Puoi facilmente pensare ai cookie come file di testo, che vengono salvati sul tuo computer. Su richiesta di un server web, il tuo browser crea tale file. Dopo ciò, il server Web può leggere e scrivere contenuti da e su questo file. Anche se questa sembra una caratteristica pericolosa - dopo tutto, a nessuno piacciono altre persone che scrivono file sul proprio computer, ci sono alcune restrizioni per rendere questo processo il più sicuro possibile.
I cookie hanno una data di scadenza. Questa data è impostata in modo che il browser possa cancellare i vecchi cookie quando non sono più necessari dal server web. Se la data di scadenza è vuota, il cookie verrà eliminato quando la connessione con il server viene chiusa. Ciò si verifica quando la finestra o la scheda del sito viene chiusa dall'utente o quando l'utente chiude l'intero browser. Questi cookie, a volte chiamati cookie di sessione, sono principalmente utilizzati per la memorizzazione di impostazioni temporanee.
Scopriamo come sono queste cose a livello tecnico. I cookie vengono trasferiti tramite il protocollo HTTP. Questo è il protocollo utilizzato dai browser per recuperare e inviare file al server. Dopo che un cookie è stato richiesto, viene inviato al server ogni volta che un nuovo elemento nella pagina web viene recuperato dal browser. Di seguito, possiamo vedere uno snippet di un server che richiede un nuovo cookie (questo frammento è una parte di una risposta HTTP).
Set-Cookie: Name = content data; scade = Ven, 31-Dec-2010 23:59:59 GMT; percorso = /; domain = .example.net
Ora non aver paura, è tutto molto comprensibile!
Nel prossimo passaggio, esamineremo come queste proprietà possono essere utilizzate nei linguaggi di programmazione.
I cookie possono essere creati in molti modi, ma, per gli scopi di questo tutorial, ci concentreremo su PHP e JavaScript.
La cosa più importante da ricordare, quando crei un cookie in PHP, è che devi impostare tutti i cookie prima di inviare qualsiasi dato al browser. Questo significa che dovresti sempre inizializza nuovi cookie prima qualsiasi uscita. Ciò include i comandi echo () o print () e il comando o
tag. Certo, ci sono alcune eccezioni, ma questa è una regola generale.... // tutto il contenuto ecc. Va qui?>
Questo dovrebbe sembrare familiare, ad eccezione di $ garantire e $ HttpOnly. Il 'sicuro' è forzare il cookie a essere inviato solo se è stata stabilita una connessione HTTPS, se impostata su true, e dovrebbe normalmente essere impostata su false. 'Httponly' rende il cookie disponibile solo attraverso il protocollo HTTP, il che significa che i linguaggi lato client, come JavaScript e VBscript, non possono accedere al cookie. Questo aiuta a prevenire cose brutte, come Cross Site Scripting, e dovrebbe essere impostato su true se non si ha intenzione di modificare i cookie lato client con una lingua come JavaScript. Inoltre, per evitare equivoci, "httponly" non significa che i cookie non possono essere inviati su HTTPS, perché possono ancora, in effetti. Tuttavia, tieni presente che lo snippet precedente può essere reso abbastanza piccolo (e dovrebbe essere):
Grande! Ora possiamo creare i cookie, ma dobbiamo essere in grado di leggerli. Fortunatamente per noi, PHP rende questo molto facile una volta che un cookie è già stato creato. In PHP, esiste una variabile d'ambiente chiamata $ _COOKIE [], che può essere utilizzata per estrarre il valore del cookie. Per utilizzarlo basta inserire il nome del cookie all'interno delle parentesi [] in questo modo:
Questa variabile ambientale può essere utilizzata come qualsiasi altra. Proprio come $ _GET [] e $ _POST [], può essere trattato direttamente come una variabile normale (una volta che hai controllato se il cookie esiste effettivamente di corso) se vuoi.
Se si desidera modificare la data di scadenza, il percorso o il dominio, è necessario sovrascrivere un cookie esistente con setcookie () utilizzando lo stesso nome del cookie originale. Se si modifica la data di scadenza per essere nel passato (time () - 30 * 60 per esempio), il cookie verrà eliminato.
I cookie possono essere letti e scritti anche sul lato client. Anche se JavaScript non offre una buona soluzione per leggere e scrivere i cookie, è possibile e ampiamente utilizzato. JavaScript utilizza l'oggetto document.cookie per la manipolazione dei cookie, come mostrato nel seguente snippet:
// get current date var expiredate = new Date (); // aumenta la data di 5 ore expiredate.setHours (expiredate.getHours () + 5); document.cookie = 'cookiename = cookievalue; expires = "+ expiredate.toUTCString () +" percorso = / esempio /; domain = test.envato.com ';
Come avrai notato, questa sintassi è abbastanza simile alla notazione del protocollo HTTP. Questo ha il vantaggio di essere più in controllo, ma introduce anche alcuni potenziali problemi. Di seguito è il
var cookieName = 'testcookiename'; var textArray = document.cookie.split (';'); // metti tutte le parti della stringa in una matrice per (var i = 0; i < textArray.length; i++) // loop though all string pieces var textPiece = textArray[i]; //contains 1 string piece //filter beginning spaces while(textPiece(0)==") textPiece = textPiece.substring(1,textPiece.length); //if the textpiece contains our cookies name if (textPiece.indexOf(cookieName)== 0) //return whats after the cookies name return textPiece.substring(cookieName.length,c.length);
Lo so, lo so; questo è un dolore. Fortunatamente per voi ragazzi, sto postando alcune funzioni pre-scritte qui sotto (potreste voler creare le vostre funzioni per scopi di apprendimento, e dovreste farlo!).
function writeCookie (cookieName, cookieValue, expireHours, path, domain) var date = new Date (); date.setHours (date.getHours + expireHours); document.cookie = cookieName + '=' + cookieValue + '; scade = "+ data +"; percorso = "+ percorso +"; domain = "+ domain; funzione readCookie (cookieName) var textArray = document.cookie.split ("; '); per (var i = 0; i < textArray.length; i++) var textPiece = textArray[i]; while(textPiece(0)==") textPiece = textPiece.substring(1,textPiece.length); if (textPiece.indexOf(cookieName)== 0) return textPiece.substring(cookieName.length,c.length);
Tieni presente che questi snippet non contengono alcun controllo degli errori.
Lo sapevate? -
I cookie sono stati inventati da Netscape, che voleva usarli per creare un carrello della spesa per un negozio online. Grazie ai cookie le persone sono state in grado di conservare gli oggetti nel carrello, anche dopo essere stati disconnessi dal negozio.
Oggigiorno, usiamo i cookie per quasi tutti gli scopi a cui puoi pensare. Puoi usarli per salvare le impostazioni dell'utente come nome, lingua, posizione o dimensioni dello schermo. Ciò può migliorare la qualità del servizio che si desidera fornire per un cliente, poiché è possibile ottimizzare il servizio per un cliente e ricordare questa ottimizzazione in futuro. Ad esempio, potresti salvare la lingua preferita del cliente su un cookie e, successivamente, mostrare il contenuto del tuo sito nella lingua preferita ogni volta che il client visita il tuo sito.
Certo, ci sono molte altre cose divertenti da fare con i cookie di questo! Nel prossimo passaggio, ti mostrerò un esempio di un frammento di codice interessante.
Finalmente! Ora possiamo iniziare a scrivere un codice fantastico! Di seguito è riportato uno snippet bonus, che utilizza i cookie per creare un meccanismo di relogin.
Prima di iniziare, questo snippet contiene un codice MySQL. Se non hai familiarità con MySQL, non farti prendere dal panico. Anche se questo frammento di codice è un po 'difficile, dovrebbe essere comprensibile con un po' di conoscenza base di PHP e cookie.
Per creare un'implementazione "ricordami", dobbiamo avere alcune cose. In primo luogo, abbiamo bisogno di una tabella di database contenente un nome utente, una password e un campo di identificazione. In secondo luogo, abbiamo bisogno di una stringa o di un numero univoco per identificare i client in modo sicuro attraverso i cookie (questa è l'identificazione nella tabella del database). In questo frammento, utilizzeremo un digest SHA-1, che è solo una stringa, come identificatore. Se usato correttamente, garantisce un'eccellente sicurezza.
La maggior parte delle persone inserisce semplicemente un nome utente e una password nel cookie e lo invia automaticamente al server. Questo dovrebbe essere evitato in ogni momento! I cookie vengono generalmente inviati attraverso una connessione non sicura, quindi il contenuto potrebbe essere facilmente visto da eventuali potenziali aggressori.
nome utente; // qui dovresti impostare un nuovo digest per il prossimo relogin usando il codice sopra! echo 'Accesso effettuato con successo'. $ username; else // digest non esisteva (o sono stati trovati più degli stessi digest, ma non succederà) echo "non è riuscito ad accedere!"; ?>
Usando un digest come abbiamo fatto, le possibilità di ottenere due dello stesso digest sono minime. Un digest è una stringa di quaranta caratteri, che, in teoria, dovrebbe sempre fornire un'uscita casuale completa se l'input è cambiato. In pratica, è necessario aggiungere un limite di tempo nel codice serveride, in modo che il digest non sia valido dopo X minuti. Questo impedisce agli aggressori di copiare i cookie di qualcuno e utilizzarli per accedere.
Abbiamo quasi raggiunto la fine di questo tutorial. Per concludere vorrei riassumere alcune buone pratiche:
Spero che tu abbia imparato un po 'dal tutorial di Nettuts + di oggi. Se avete domande, sentitevi liberi di lasciare un commento o salutate su Twitter.