利用php实现一周之内自动登录存储机制（cookie、session、localStorage）
cookie、session、localStorage这三个应该是最让程序员头疼的了,我利用简单的登录界面的username和password来说明一下吧.
1.cookie用来存储用户相关数据，存储的位置在用户本地：
首先是登录界面定义:
<formaction="server.php"method="post"> <inputtype="text"name="username"class="username"placeholder="Username"> <inputtype="password"name="password"class="password"placeholder="Password"> <buttontype="submit">Signmein</button> <divclass="error"><span>+</span></div> </form>
上面的代码大家都懂吧,就是一个表单.然后就是action的server.php服务器处理,
<?php
/**
*CreatedbyPhpStorm.
*User:Administrator
*Date:2016-7-19
*Time:11:50
*/
include"data.php";
header("Content-type:text/html;charset=utf-8");
//echo"ddd";
if($_SERVER["REQUEST_METHOD"]=="POST"){//第一步
//echo"ddd1";
if($_POST["username"]==$info["username"]&&$_POST["password"]==$info["password"]){//第二步
$myArr=$_POST;
$myArr=array_merge($myArr,array("loginIP"=>$_SERVER["REMOTE_ADDR"],"loginTime"=>time()));
se($myArr);
setcookies($_POST["username"],$_POST["password"]);
setStroage($_POST["username"],$_POST["password"]);
echo"<script>
window.location.href='index.php';
</script>";
}
}else{
echo"<script>
alert('请登录');
window.location.href='login.html';
</script>";
}
//通过session保存到服务器
functionse(array$arr)
{
session_start();
$_SESSION["username"]=$arr["username"];
$_SESSION["password"]=$arr["password"];
$_SESSION["loginIP"]=$arr["loginIP"];
$_SESSION["loginTime"]=$arr["loginTime"];
}
//通过cookie保存到本地
functionsetCookies($username,$password)
{
setcookie("username",$username,time()+120);
setcookie("password",$password,time()+120);
}
//echo"<script>
//
//localStorage.setItem('username','$username');
//localStorage.setItem('password',"."'".$password."'".");
//</script>";
functionsetStroage($username,$password){
echo"<script>
localStorage.setItem('username',"."'".$username."'".");
localStorage.setItem('password',"."'".$password."'".");
</script>";
}
上面加载了一个data.php其实里面就是一条数据,
$info=array("username"=>"admin","password"=>"admin");
这个数据主要是核对输入的用户名和密码是否正确.
首先在server里面对不也是判断是不是post请求,如果不是就提示重新登录,返回登录界面,确定是post之后,再进行判断信息是不是输入正确，如果正确就setcookie一下.下面的代码我一一解释
$myArr=$_POST;//把post传过来的数据放在myarr;里面
$myArr=array_merge($myArr,array("loginIP"=>$_SERVER["REMOTE_ADDR"],"loginTime"=>time()));//这是穿的另外两个参数,一个是用户登录地址,另一个是cookie存活时间(会在寻获时间以为消失)
se($myArr);
setcookies($_POST["username"],$_POST["password"]);//这个是设置cookie,把传过来的两个值设置成cookie,会有一个getCookie进行接收
setStroage($_POST["username"],$_POST["password"]);
echo"<script>
window.location.href='index.php';
其实这时候cookie已经按我们设置的那个时间存储下来了,然后我们要做的就是免登陆功能,的后台服务器的处理,就像我们登陆其他软件,会提示一周之内免登陆密码,
就是下面的代码:
functionintialLoadInfo(){
$("input:text").val(getCoolieByKey("username"));//这两个就是吧下面获取的之前输入过的用户名和密码进行自动填写(实现目的)
$("input:password").val(getCoolieByKey("password"));
}
//通过key值获取cookie
functiongetCoolieByKey(key){
varcookie=document.cookie.split(";");//这行代码是吧cookie的值进行分离(split),以便于下面遍历(分离后就是一个数组一样)
for(vari=0;i<cookie.length;i++){//遍历长度
varvalue=cookie[i].trim();//去掉空格
if(value.indexOf(key)==0){//判断是不是第一个值
val=value.split("=");
console.log(val[0]);
returnval[1];
}
}
}
上面第一个方法执行getCookieByKey(key);
这个带参数的函数接收的参数就是我们上面封装好的myArr数据了;
然后详细解释就在代码了,大家可以参考了.
2.session:session是用来在服务器端存储用户信息，当浏览器关闭的时候，会自动销毁；
session_start();
超级数组$_SESSION可以实现session的设置与读取；
代码如下:
functionse(array$arr)
{
session_start();
$_SESSION["username"]=$arr["username"];
$_SESSION["password"]=$arr["password"];
$_SESSION["loginIP"]=$arr["loginIP"];
$_SESSION["loginTime"]=$arr["loginTime"];
}
首先就会上面的代码,一样是获取四个属性,放到我们的$_SESSION里面;存储下来:
然后就是上面那个代码,带啊可以看到有一个se
$myArr=array_merge($myArr,array("loginIP"=>$_SERVER["REMOTE_ADDR"],"loginTime"=>time()));//这是穿的另外两个参数,一个是用户登录地址,另一个是cookie存活时间(会在寻获时间以为消失)
se($myArr);
这里就是为了session写的;
他主要是存储四个属性,username.password.IP.time
上面代码中也注释;其实现在我们就可以在session里面查到我们这个自己创建的session了
3.JS端的localStorage:HTML5提供的本地存储方式（可以称为“键值对”数据库）；
设置数据：localStorage.setItem("key","value");
读取数据：localStorage.getItem("key");读取的结果是一个字符串；
删除数据：localStorage.removeItem("key");
详细代码如下:
在html下面写的js文件就是 然后就是实现:
$(function(){
if(localStorage.getItem("username")!=""&&localStorage.getItem("password")!=""){
document.getElementById("username").value=localStorage.getItem("username");
document.getElementById("password").value=localStorage.getItem("password");
}
});
这个函数主要就是创建用php创建的
functionsetStroage($username,$password){
echo"<script>
localStorage.setItem('username',"."'".$username."'".");
localStorage.setItem('password',"."'".$password."'".");
</script>";
}
其实这个东西需要自己慢慢写，我虽然能写出来,但是每次用的时候还是要参考一下这个例子,所以希望我用了好长时间的万能例子对大家有用，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！