数据持久化操作
描述：数据持久化也叫数据本地化，是一种将数据“长久”的保存在客户端的操作。
作用：通过数据持久化操作，能够实现网站的登录效果。
避免用户在网站页面间浏览的时候重复登录
也能实现快速登录，一段时间之内保存用户的登录效果，提高页面访问速率。
类型：在html5中提供了一共三种数据持久化操作的方法
(1)cookie
(2)localStorage
(3)sessionStorage
前端操作cookie
说明：cookie可以认为是一个记录了简单内容的一个文本文件
cookie是直接绑定在html页面之上的。
查看：控制台->application选项->左边栏菜单->cookies
操作：cookie的设置分为前端设置和后端设置两种方案
前端：
写入cookie：document.cookie = 'key=value;expires=过期时间戳ms';
读取cookie：console.log(document.cookie);
删除cookie：document.cookie = 'key=value;expires=当前时间戳+1';
补充：前端操作cookie时，时间戳必须通过toGMTString()方法转换为标准时才行
强调：前端设置cookie时，时间戳单位是毫秒ms
*/
//写入一条cookie
//设置时间戳
// var expires = new Date(new Date().getTime() + 1000*1000).toGMTString();
// document.cookie = 'username=frank;expires='+expires;
//读取cookie
// var tempArr = document.cookie.split('=');
// var tempObj = {};
// tempObj[tempArr[0]] = tempArr[1];
// console.log(tempObj);
// console.log(tempObj.username);
//删除一条cookie
// var expires = new Date(new Date().getTime() + 1).toGMTString();
// document.cookie = 'username=frank;expires='+expires;
console.log(document.cookie);
后端操作cookie
button>点击添加cookie</button>
<script>
(function (){
var cookie = document.cookie;
if(cookie.length != 0){
console.log('已经登录，不用再显示登录按钮');
}
})();
document.querySelector('button').onclick = function (){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function (){
if(xhr.readyState == 4){
if(xhr.status == 200){
console.log(xhr.responseText);
}
}
};
//
var formData = new FormData();
formData.append('uname','frank');
//
xhr.open('post', 'cookie(server).php', true);
xhr.send(formData);
};
cookie的后端操作
说明：哪个html页面访问了本php文件，就给哪个html页面添加cookie
语法：
(1)写入cookie：setcookie('key','value','expires','path');
(2)获取cookie：$_COOKIE
(3)删除cookie：setcookie('key','value','expires-1','path')
说明：
(1)在php中获取时间戳的方式为time()，单位是秒s
(2)前三个参数为必要参数，后面的参数为可选参数
<?php
$username = $_POST['uname'];
// $success = array('msg'=>'ok', 'info'=>$_POST);
// echo json_encode($success);
// 假设判断完成..
// 设置cookie
// setcookie('uname', $username, time()+60*60);
// 读取cookie
// echo json_encode($_COOKIE);
// 删除cookie
// setcookie('uname', '', time()-1);
?>
