PHP操作Session和Cookie

PHP操作Session和Cookie

helloweba.com 作者:月光光 时间:2014-12-20 17:56 标签: php  session  cookie

我们跟踪用户信息时需要用到Session和Cookie,比如用户登录验证、记录用户浏览历史,存储购物车数据,限制用户会话有效时间等。今天我们来了解下PHP是如何操作Session和Cookie的。

Session

PHP的$_SESSION可以存储当前用户数据信息,用户访问WEB网站的时候,PHP会给每个访问的用户创建一个session ID,该ID是唯一ID,保存在客户机上,而用户的会话数据是保存到服务端的,PHP可以对每个不同的用户信息进行存储,当会话过期后,用户 session信息也会失效。

使用Session,在使用PHP session时,一定要在页头加上session_start(),告诉服务器开始使用session了,而且在它之前应该没有任何输出,否则会报错。

<?php 
session_start();  
 
//PHP 代码... 
?> 

PHP设置与获取Session

我们可以使用PHP的$_SESSION来设置和获取Session数据,如:

<?php 
session_start();   
 
//设置一个session值 
$_SESSION["name"] = "Hello";  
 
//将session以数组形式保存 
$_SESSION["arr"] = array('name' => 'Hello''url' => 'http://www.helloweba.com''type'=> 'website'); 
?> 

一旦储存了Session数据,我们就可以在网站上使用Session,比如我们在另一个页面就可以获取Session数据:

<?php 
session_start();   
 
//获取保存的Session name  
echo $_SESSION["name"]; 
 
//打印数组session 
print_r($_SESSION["arr"]); 
?> 

PHP删除Session

当不再使用Session时,我们可以使用PHP将session数据删除和清空,方法如下:

<?php 
unset($_SESSION["name"]); 
?> 

如果要清空当前用户所有的Session信息可以使用以下代码:

<?php 
session_destroy(); 
?> 

Cookie

Cookie是由用户访问的网站服务端给当前客户机上创建的一个临时文件,用来保存用户信息,以便用户下次继续访问该网站时,网站服务器能识别用户信息,常见的Cookie用来保存用户界面,用户ID等数据。

PHP设置Cookie

我们可以使用PHP的setcookie()在客户端创建cookie,这个函数提供主要的三个参数,cookie名称,值和有效时长。

<?php 
$cookie_val = 'Chrome';  
setcookie("browser"$cookie_val, time()+3600);  
?> 

运行以上代码,将会创建一个名称为Chrome的Cookie,并且在客户端保存1个小时,1小时后该cookie信息失效。

PHP接收Cookie

当Cookie创建后,我们很容易就可以获取到cookie值,使用PHP的$_COOKIE,用法如下:

<?php 
if(isset($_COOKIE['browser'])) { 
    echo '您的浏览器是:' . $_COOKIE['browser']; 
} 
?> 

PHP删除Cookie

如果你想彻底在你的机器上删除保存的cookie信息,可以使用以下代码:

<?php 
setcookie("browser""", time()-3600); 
?> 

以上代码将名称为browser的cookie清空,并将有效期设置到1小时前,完全清空了cookie信息。

此外前端Javascript也有操作cookie的例子,本站有文章介绍。

本文从初学者角度考虑,讲解了PHP入门级的知识:Session和Cookie的应用,我们不必去深究其原理,只要会用就行。2015快要来了,接下来Helloweba打算将几个前端与后端PHP的交互项目分享给大家,当然会用到Session和Cookie了,像WEB聊天室、在线视频、HTML5在线直播等等,敬请期待。

PHP接收POST数据方式

$_POST方式接收数据

$_POST方式是通过 HTTP POST 方法传递的变量组成的数组,是自动全局变量。如使用$_POST[‘name’]就可以接收到网页表单以及网页异步方式post过来的数据, 即$_POST只能接收文档类型为Content-Type: application/x-www-form-urlencoded提交的数据。

$GLOBALS[‘HTTP_RAW_POST_DATA’]方式接收数据

如果用过post过来的数据不是PHP能够识别的文档类型,比如 text/xml 或者 soap 等等,我们可以用$GLOBALS[‘HTTP_RAW_POST_DATA’]来接收。$HTTP_RAW_POST_DATA 变量包含有原始的POST数据。此变量仅在碰到未识别MIME 类型的数据时产生。$HTTP_RAW_POST_DATA 对于enctype=”multipart/form-data” 表单数据不可用。也就是说使用$HTTP_RAW_POST_DATA无法接收网页表单post过来的数据。

php://input方式接收数据

如果访问原始 POST 数据的更好方法是 php://input。php://input 允许读取 POST 的原始数据。和 $HTTP_RAW_POST_DATA 比起来,它给内存带来的压力较小,并且不需要任何特殊的php.ini设置,而php://input不能用于 enctype=”multipart/form-data”。

例如,用户使用某个客户端应用程序post给服务器一个文件,文件的内容我们不管它,但是我们要把这个文件完整的保存在服务器上,我们可以使用如下代码:

$input = file_get_contents('php://input'); 
file_put_contents($original$input); //$original为服务器上的文件 

以上代码使用file_get_contents(‘php://input’)接收post数据,然后将数据写入$original文件中,其实可以理解为从客户端上传了一个文件到服务器上,此类应用非常多,尤其是我们PHP开发要与C,C++等应用程序开发进行产品联合开发时会用到,例如本站有文章:拍照上传就是结合flash利用此原理来上传照片的。

以下是一个小示例,演示了$_POST,$GLOBALS[‘HTTP_RAW_POST_DATA’]和php://input三种不同方式的接收POST数据处理:

a.html

<form name="demo_form" action="post.php" method="post"> 
    <p><label>Name: </label><input type="text" class="input" name="name"></p> 
    <p><label>Address: </label><input type="text" class="input" name="address"></p> 
    <p><input type="submit" name="submit" class="btn" value="Submit"></p> 
</form> 

post.php

header("Content-type:text/html;charset=utf-8"); 
 
echo '$_POST接收:<br/>'; 
print_r($_POST); 
echo '<hr/>'; 
 
echo '$GLOBALS[\'HTTP_RAW_POST_DATA\']接收:<br/>'; 
print_r($GLOBALS['HTTP_RAW_POST_DATA']); 
echo '<hr/>'; 
 
echo 'php://input接收:<br/>'$data = file_get_contents('php://input'); 
print_r(urldecode($data)); 

jQuery弹出窗口切换登录与注册表单

当点击页面中的登录或注册按钮时,将会弹出一个模态窗口,就是一个弹出层,我们可以在弹出层上轻松的切换登录与注册表单,极大的方便用户,不需要关闭层再去点击转向其他操作,在很多网站上已经广泛应用。

本文结合实例,通过使用jQuery以及CSS3和HTML5技术实现这一效果。

HTML

我们现在主页面上设置两个链接按钮,即登录和注册按钮。

<nav class="main_nav"> 
    <ul> 
        <li><a class="cd-signin" href="#0">登录</a></li> 
        <li><a class="cd-signup" href="#0">注册</a></li> 
    </ul> 
</nav> 

然后,建立模态窗口弹出层div.cd-user-modal,在弹出层中放置两个用于切换的链接ul.cd-switcher,然后放置登录和注册表单,分别对应div#cd-login和div#cd-signup。

<div class="cd-user-modal">  
    <div class="cd-user-modal-container"> 
        <ul class="cd-switcher"> 
            <li><a href="#0">用户登录</a></li> 
            <li><a href="#0">注册新用户</a></li> 
        </ul> 
 
        <div id="cd-login">  
            <form class="cd-form"> 
                <!-- 登录表单 --> 
            </form> 
        </div> 
 
        <div id="cd-signup">  
            <form class="cd-form"> 
                <!-- 注册表单 --> 
            </form> 
        </div>         
    </div> 
</div>  

以上是整个html结构,其中的form表单部分在此省略,大家可以根据需求自由写出你的表单结构,你也可以直接下载查看源码。

CSS

默认的模态窗口拥有 visibility: hidden; and opacity: 0;的样式,也就是默认不可见。通过.is-visible来决定是否弹出显示。以下是主要的css代码,更详细的css代码请下载源代码查看。

.cd-user-modal { 
  position: fixed; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  background: rgba(5254660.9); 
  z-index: 3; 
  overflow-y: auto; 
  cursor: pointer; 
  visibility: hidden; 
  opacity: 0; 
  -webkit-transition: opacity 0.3s 0, visibility 0 0.3s; 
  -moz-transition: opacity 0.3s 0, visibility 0 0.3s; 
  transition: opacity 0.3s 0, visibility 0 0.3s; 
} 
.cd-user-modal.is-visible { 
  visibility: visible; 
  opacity: 1; 
  -webkit-transition: opacity 0.3s 0, visibility 0 0; 
  -moz-transition: opacity 0.3s 0, visibility 0 0; 
  transition: opacity 0.3s 0, visibility 0 0; 
} 
.cd-user-modal.is-visible .cd-user-modal-container { 
  -webkit-transform: translateY(0); 
  -moz-transform: translateY(0); 
  -ms-transform: translateY(0); 
  -o-transform: translateY(0); 
  transform: translateY(0); 
} 
 
.cd-user-modal-container { 
  position: relative; 
  width: 90%; 
  max-width: 600px; 
  background: #FFF; 
  margin: 3em auto 4em; 
  cursor: auto; 
  border-radius: 0.25em; 
  -webkit-transform: translateY(-30px); 
  -moz-transform: translateY(-30px); 
  -ms-transform: translateY(-30px); 
  -o-transform: translateY(-30px); 
  transform: translateY(-30px); 
  -webkit-transition-property: -webkit-transform; 
  -moz-transition-property: -moz-transform; 
  transition-property: transform; 
  -webkit-transition-duration: 0.3s; 
  -moz-transition-duration: 0.3s; 
  transition-duration: 0.3s; 
} 
.cd-user-modal-container .cd-switcher:after { 
  content: ""; 
  display: table; 
  clear: both; 
} 
.cd-user-modal-container .cd-switcher li { 
  width: 50%; 
  float: left; 
  text-align: center; 
} 
.cd-user-modal-container .cd-switcher li:first-child a { 
  border-radius: .25em 0 0 0; 
} 
.cd-user-modal-container .cd-switcher li:last-child a { 
  border-radius: 0 .25em 0 0; 
} 
.cd-user-modal-container .cd-switcher a { 
  display: block; 
  width: 100%; 
  height: 50px; 
  line-height: 50px; 
  background: #d2d8d8; 
  color: #809191; 
} 
.cd-user-modal-container .cd-switcher a.selected { 
  background: #FFF; 
  color: #505260; 
} 
 
#cd-login#cd-signup { 
  display: none; 
} 
 
#cd-login.is-selected#cd-signup.is-selected{ 
  display: block; 
} 

jQuery

弹出层的弹出和关闭效果由jquery控制样式.is-visible的调用,切换表单是由jQuery控制演示.is-selected的调用。

jQuery(document).ready(function($){ 
    var $form_modal = $('.cd-user-modal'), 
        $form_login = $form_modal.find('#cd-login'), 
        $form_signup = $form_modal.find('#cd-signup'), 
        $form_modal_tab = $('.cd-switcher'), 
        $tab_login = $form_modal_tab.children('li').eq(0).children('a'), 
        $tab_signup = $form_modal_tab.children('li').eq(1).children('a'), 
        $main_nav = $('.main_nav'); 
 
    //弹出窗口 
    $main_nav.on('click'function(event){ 
 
        if( $(event.target).is($main_nav) ) { 
            // on mobile open the submenu 
            $(this).children('ul').toggleClass('is-visible'); 
        } else { 
            // on mobile close submenu 
            $main_nav.children('ul').removeClass('is-visible'); 
            //show modal layer 
            $form_modal.addClass('is-visible');     
            //show the selected form 
            ( $(event.target).is('.cd-signup') ) ? signup_selected() : login_selected(); 
        } 
 
    }); 
 
    //关闭弹出窗口 
    $('.cd-user-modal').on('click'function(event){ 
        if( $(event.target).is($form_modal) || $(event.target).is('.cd-close-form') ) { 
            $form_modal.removeClass('is-visible'); 
        }     
    }); 
    //使用Esc键关闭弹出窗口 
    $(document).keyup(function(event){ 
        if(event.which=='27'){ 
            $form_modal.removeClass('is-visible'); 
        } 
    }); 
 
    //切换表单 
    $form_modal_tab.on('click'function(event) { 
        event.preventDefault(); 
        ( $(event.target).is( $tab_login ) ) ? login_selected() : signup_selected(); 
    }); 
 
    function login_selected(){ 
        $form_login.addClass('is-selected'); 
        $form_signup.removeClass('is-selected'); 
        $form_forgot_password.removeClass('is-selected'); 
        $tab_login.addClass('selected'); 
        $tab_signup.removeClass('selected'); 
    } 
 
    function signup_selected(){ 
        $form_login.removeClass('is-selected'); 
        $form_signup.addClass('is-selected'); 
        $form_forgot_password.removeClass('is-selected'); 
        $tab_login.removeClass('selected'); 
        $tab_signup.addClass('selected'); 
    } 
 
}); 

该实例在手机等移动设备上也有很好的展示效果,由于运用了css3效果,所以如果您使用IE浏览器,请将版本升级到IE9以上。强烈建议大家下载源代码,稍微改下直接就可以运用到你的项目中。

Javascript的setTimeOut和setInterval的定时器用法

Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等等。但它们的应用是有区别的。

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则是在每隔指定的毫秒数循环调用函数或表达式,直到 clearInterval把它清除。也就是说setTimeout()只执行一次,setInterval()可以执行多次。两个函数的参数也相同,第 一个参数是要执行的code或句柄,第二个是延迟的毫秒数。

setTimeOut用法

setTimeout函数的用法如下:

var timeoutID = window.setTimeout(func, [delay, param1, param2, ...]); 
var timeoutID = window.setTimeout(code, [delay]); 

timeoutID:定时器ID号,它可以在clearTimeout()函数中被用来清除定时器。

func:被执行的函数。

code:(替代的语法)一个被执行的代码串。

delay:延迟的时间,单位毫秒。如果没有指定,默认为0。

我们可以使用window.setTimeout或setTimeout,两个写法基本一样,只不过window.setTimeout将setTimeout函数作为全局window对象的一个属性来引用。

应用示例:

function timeout(){ 
    document.getElementById('res').innerHTML=Math.floor(Math.random()*100 + 1); 
} 
setTimeout("timeout()",5000); 

代码执行时,5秒后调用timeout()函数,点击看演示

setInterval用法

setInterval函数的参数及用法和setTimeout函数一样,请参照上文的setTimeout函数的用法介绍。不同的是,setInterval每隔一定的时间执行当中的func或code代码。

应用示例:

var tt = 10function timego(){ 
    tt--; 
    document.getElementById("tt").innerHTML = tt; 
    if(tt==0){  
        window.location.href='/'; 
        return false; 
    } 
} 
var timer = window.setInterval("timego()",1000); 

函数timego()定义了页面元素#tt显示的内容,当tt等于0时,页面定向到首页。然后我们定义一个定时器timer,使用setInterval()每隔1秒调用一次timego()。这样timego会执行10次,每次数字tt会减1,直到为0。那么如果想停止定时器,可以使用以下代码:

window.clearInterval(timer);  

代码执行时,10秒后页面跳转到首页,点击看演示

其实setTimeout()也可以实现每隔一段时间重复执行某个函数,但我们还是简单的区别使用setTimeOut和setInterval。另外javascript都是以单线程的方式运行于浏览器的javascript引擎中,实际应用中复杂的任务中需要排队执行,这就可能导致定时器时间不准,这个问题在大型应用中需要考虑,本文不做深究。