Capítulo 8

Cookies x sessionStorage


Armazenar cookie e dado

Ler cookie e dado

Apagar cookie e dado

Instruções: Crie um cookie e dado nesta página;
Leia o cookie e dado criados;
Abra uma nova janela ou aba no navegador e cole o endereço desta página;
Carregue a página e leia o cookie e dado.
Compare a leitura com a leitura na página anterior;
Tire suas conclusões.

JavaScript

<script src="cokieutil.js"></script> // Objeto CookieUtil
<script>
function salvarCookie(name) {
	var valor = document.forms['cookieform'].cookievalue.value;
	var itemStorage = sessionStorage.setItem('dataStorage', valor);
	var valorItemStorage = sessionStorage.getItem('dataStorage');
	if (!valor)
		alert('Entre um valor para o cookie e dado.');
	else {
		CookieUtil.set(name,valor);
		var mensagem = 'Um cookie denominado "meuCookie" com o valor '+valor+'\n';
		mensagem += 'e um dado com o nome "dataStorage" com o valor '+valorItemStorage+'\n';
		mensagem += 'foram criados'
		alert(mensagem);
	}
}
function lerCookie(name) {
	var valorItemStorage = sessionStorage.getItem('dataStorage');
	var mensagem = 'Um cookie denominado "meuCookie" com o valor '+CookieUtil.get(name)+'\n';
	mensagem += 'e um dado com o nome "dataStorage" com o valor '+valorItemStorage+'\n';
	mensagem += 'foram lidos'
	alert(mensagem);
}
function apagarCookie(name) {
	CookieUtil.unset(name);
	sessionStorage.removeItem('dataStorage');
	alert('Cookie com o nome "meuCookie" e dado com o nome "dataStorage" foram apagados');
}
</script>

HTML

<section>	
<form name="cookieform" action="#"><p>
<label>Escolha um valor para o cookie de nome "meuCookie".<br>O mesmo valor será usado para o dado de nome "dataStorage":</label><br> <input name="cookievalue">
</p>
</form>
<p><a href="#" onclick="salvarCookie('meuCookie')">Armazenar cookie e dado</a></p>
<p><a href="#" onclick="lerCookie('meuCookie')">Ler cookie e dado</a></p>
<p><a href="#" onclick="apagarCookie('meuCookie')">Apagar cookie e dado</a></p>
</section>