利用php實(shí)現(xiàn)一周之內(nèi)自動(dòng)登錄存儲(chǔ)機(jī)制（cookie、session、localStorage）

更新時(shí)間：2016年10月31日 10:24:06 作者：張張張的博客

本篇文章主要介紹了利用php實(shí)現(xiàn)一周之內(nèi)自動(dòng)登錄存儲(chǔ)機(jī)制（cookie、session、localStorage），可以實(shí)現(xiàn)一周之內(nèi)免費(fèi)登陸，感興趣的小伙伴們可以參考一下。

cookie、session、localStorage這三個(gè)應(yīng)該是最讓程序員頭疼的了,我利用簡單的登錄界面的username和password來說明一下吧.

1.cookie用來存儲(chǔ)用戶相關(guān)數(shù)據(jù)，存儲(chǔ)的位置在用戶本地：

首先是登錄界面定義:

<form action="server.php" method="post"> 
        <input type="text" name="username" class="username" placeholder="Username"> 
        <input type="password" name="password" class="password" placeholder="Password"> 
        <button type="submit">Sign me in</button> 
        <div class="error"><span>+</span></div> 
      </form>

上面的代碼大家都懂吧,就是一個(gè)表單.然后就是action的server.php服務(wù)器處理,

<?php 
/** 
 * Created by PhpStorm. 
 * 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保存到服務(wù)器 
function se(array $arr) 
{ 
  session_start(); 
  $_SESSION["username"] = $arr["username"]; 
  $_SESSION["password"] = $arr["password"]; 
  $_SESSION["loginIP"] = $arr["loginIP"]; 
  $_SESSION["loginTime"] = $arr["loginTime"]; 
} 
//通過cookie保存到本地 
function setCookies($username, $password) 
{ 
  setcookie("username", $username, time() + 120); 
  setcookie("password", $password, time() + 120); 
} 
 
//echo "<script> 
// 
//  localStorage.setItem('username','$username'); 
//localStorage.setItem('password'," . "'" . $password . "'" . "); 
//</script>"; 
function setStroage($username, $password){ 
  echo "<script> 
  localStorage.setItem('username'," . "'" . $username . "'" . "); 
  localStorage.setItem('password'," . "'" . $password . "'" . "); 
  </script>"; 
}

上面加載了一個(gè)data.php其實(shí)里面就是一條數(shù)據(jù),

$info=array("username"=>"admin","password"=>"admin");

這個(gè)數(shù)據(jù)主要是核對輸入的用戶名和密碼是否正確.

首先在server里面對不也是判斷是不是post請求,如果不是就提示重新登錄,返回登錄界面,確定是post之后,再進(jìn)行判斷信息是不是輸入正確，如果正確就setcookie一下.下面的代碼我一一解釋

$myArr = $_POST;//把post傳過來的數(shù)據(jù)放在myarr;里面 
    $myArr = array_merge($myArr, array("loginIP" => $_SERVER["REMOTE_ADDR"], "loginTime" => time()));//這是穿的另外兩個(gè)參數(shù),一個(gè)是用戶登錄地址,另一個(gè)是cookie存活時(shí)間(會(huì)在尋獲時(shí)間以為消失) 
    se($myArr); 
    setcookies($_POST["username"], $_POST["password"]);//這個(gè)是設(shè)置cookie,把傳過來的兩個(gè)值設(shè)置成cookie,會(huì)有一個(gè)getCookie進(jìn)行接收 
    setStroage($_POST["username"], $_POST["password"]); 
    echo "<script> 
  window.location.href='index.php';

其實(shí)這時(shí)候cookie已經(jīng)按我們設(shè)置的那個(gè)時(shí)間存儲(chǔ)下來了,然后我們要做的就是免登陸功能,的后臺(tái)服務(wù)器的處理,就像我們登陸其他軟件,會(huì)提示一周之內(nèi)免登陸密碼,

就是下面的代碼:

function intialLoadInfo(){ 
    $("input:text").val(getCoolieByKey("username"));//這兩個(gè)就是吧下面獲取的之前輸入過的用戶名和密碼進(jìn)行自動(dòng)填寫(實(shí)現(xiàn)目的) 
    $("input:password").val(getCoolieByKey("password")); 
  } 
  //通過key值獲取cookie 
  function getCoolieByKey(key){ 
    var cookie=document.cookie.split(";");//這行代碼是吧cookie的值進(jìn)行分離(split),以便于下面遍歷(分離后就是一個(gè)數(shù)組一樣) 
    for(var i=0;i<cookie.length;i++){//遍歷長度 
      var value=cookie[i].trim();//去掉空格 
      if (value.indexOf(key)==0){//判斷是不是第一個(gè)值 
        val=value.split("="); 
        console.log(val[0]); 
        return val[1]; 
      } 
    } 
  }

上面第一個(gè)方法執(zhí)行g(shù)etCookieByKey(key);

這個(gè)帶參數(shù)的函數(shù)接收的參數(shù)就是我們上面封裝好的myArr數(shù)據(jù)了;

然后詳細(xì)解釋就在代碼了,大家可以參考了.

2.session:session是用來在服務(wù)器端存儲(chǔ)用戶信息，當(dāng)瀏覽器關(guān)閉的時(shí)候，會(huì)自動(dòng)銷毀；

session_start();

超級(jí)數(shù)組$_SESSION可以實(shí)現(xiàn)session的設(shè)置與讀??；

代碼如下:

function se(array $arr) 
{ 
  session_start(); 
  $_SESSION["username"] = $arr["username"]; 
  $_SESSION["password"] = $arr["password"]; 
  $_SESSION["loginIP"] = $arr["loginIP"]; 
  $_SESSION["loginTime"] = $arr["loginTime"]; 
}

首先就會(huì)上面的代碼,一樣是獲取四個(gè)屬性,放到我們的$_SESSION里面;存儲(chǔ)下來:

然后就是上面那個(gè)代碼,帶啊可以看到有一個(gè)se

$myArr = array_merge($myArr, array("loginIP" => $_SERVER["REMOTE_ADDR"], "loginTime" => time()));//這是穿的另外兩個(gè)參數(shù),一個(gè)是用戶登錄地址,另一個(gè)是cookie存活時(shí)間(會(huì)在尋獲時(shí)間以為消失) 
    se($myArr);

這里就是為了session寫的;

他主要是存儲(chǔ)四個(gè)屬性,username.password.IP.time

上面代碼中也注釋;其實(shí)現(xiàn)在我們就可以在session里面查到我們這個(gè)自己創(chuàng)建的session了

3.JS端的localStorage:HTML5提供的本地存儲(chǔ)方式（可以稱為“鍵值對”數(shù)據(jù)庫）；

設(shè)置數(shù)據(jù)：localStorage.setItem("key","value");
讀取數(shù)據(jù)：localStorage.getItem("key");讀取的結(jié)果是一個(gè)字符串；
刪除數(shù)據(jù)：localStorage.removeItem("key");

詳細(xì)代碼如下:

在html下面寫的js文件就是然后就是實(shí)現(xiàn):

$(function (){ 
    if (localStorage.getItem("username")!=""&&localStorage.getItem("password")!=""){ 
      document.getElementById("username").value=localStorage.getItem("username"); 
      document.getElementById("password").value=localStorage.getItem("password"); 
 
    } 
  });

這個(gè)函數(shù)主要就是創(chuàng)建用php創(chuàng)建的

function setStroage($username, $password){ 
  echo "<script> 
  localStorage.setItem('username'," . "'" . $username . "'" . "); 
  localStorage.setItem('password'," . "'" . $password . "'" . "); 
  </script>"; 
}

其實(shí)這個(gè)東西需要自己慢慢寫，我雖然能寫出來,但是每次用的時(shí)候還是要參考一下這個(gè)例子,所以希望我用了好長時(shí)間的萬能例子對大家有用，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！

您可能感興趣的文章: