COOKIE的优化与购物车小试
由于经常被抓取文章内容，在此附上博客文章网址：，偶尔会更新某些出错的数据或文字，建议到我博客地址 : --> 点击这里
一 Cookie 的优化
1.1 一般而言，我们设置cookie是在php中设置
例如：
<?php
setcookie('testKey1','hello world',,'/'); //# 当 expires = 0 时，此Cookie随浏览器关闭而失效，?>
而在验证的时候，我们通常是：
<?php
if(isset($_COOKIE['testKey2']))
echo "The New COOKIE is : testKey2 = ".$_COOKIE['testKey2'];
else
echo "The new COOKIE is setting failed";
?>
都是在服务端进行。优化：
1.2 在前端页面进行验证cookie
cookie保存在客户端，那么可以在客户端那边进行验证，根据上面的代码，前端获取代码为：
<script language="JavaScript" type="text/javascript">
var key1 = document.cookie.match(new RegExp("(^| )testKey1=([^;]*)(;|$)")); //正则找出testKey的cookie值
try{
if(key1[] != '')
document.write("testKey1 = "+key1[]);
}catch(e){
document.write("testKey1 = NULL");
};
那么我们能否在前端设置cookie 呢 ?
1.3 在前端页面设置cookie【购物车原理】
function setCookie(){
var expire = new Date();
expire.setTime(expire.getTime() + );
document.cookie = "testKey2=This the second Cookie;expires=" + expire.toGMTString() + ";path=/";
alert('完成设置');
location.href='test2.php'
}
这样子能够减轻服务器的压力
我们要注意，这样子是有限制的，浏览器本身能够存储的数据有限：
上述是从网上找来，仅供参考，如果我们要存储更多的数据。可以使用：
1.4 local storage
HTML5 提供了两种在客户端存储数据的新方法：
- localStorage - 没有时间限制的数据存储
- sessionStorage - 针对一个 session 的数据存储
之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。
在 HTML5 中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。
对于不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。
HTML5 使用 JavaScript 来存储和访问数据。
在谷歌浏览器下，f12可以看到：
可以看成是浏览器的小型数据库，可以存储更多的数据。
更多的关于localStorage相关的，可以看：http://www.w3school.com.cn/html5/html_5_webstorage.asp
示例【购物车小试】：
设置页面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo2</title> <script language="JavaScript" type="text/javascript">
var cartLSName = 'abc'; //gdsInfo=[ID,NAME,AVATAR,PRICE,NUMBER]
function addToLS(gdsInfo){
if(!window.localStorage){
alert('您的浏览器不支持Local Storage!'); //如果不支持，可以采用第1.3中的方法
return false;
} try{
if(gdsInfo.length != ){
alert('参数错误！');
return false;
}
}catch(e){alert('参数错误！');return false} var gName=gdsInfo[];
gdsInfo[]=encodeURI(gdsInfo[]);
gdsInfo[]=parseInt(gdsInfo[]);
if(isNaN(gdsInfo[])) gdsInfo[] = ; //由JSON字符串转换为JSON对象
var cartLS = JSON.parse(localStorage.getItem(cartLSName)); if(cartLS == null){
cartLS=[gdsInfo];
}else{
var existInCart=false;
for(var i=;i<cartLS.length;i++){
if(cartLS[i][] == gdsInfo[]){
cartLS[i][] += gdsInfo[];
existInCart = true;
break;
}
} if(!existInCart)
cartLS.splice(,,gdsInfo); } //将JSON对象转化为JSON字符,并存入LocalStorage
localStorage.setItem(cartLSName,JSON.stringify(cartLS));
return true;
} </script> </head> <body>
<a href="javascript:addToLS([3,'华为Mate8','ico.jpg',3888.00,2]);">存储一</a><br />
</body>
</html>
效果：
有设置，就有查看：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Show LocalStorage Info</title> <script language="JavaScript" type="text/javascript"> if(!window.localStorage){
alert('您的浏览器不支持Local Storage!');
} var cartLSName = 'abc';
var cartStr = localStorage.getItem(cartLSName)
//gdsInfo=[ID,NAME,AVATAR,PRICE,NUMBER] function showStr(){
str = decodeURIComponent(cartStr);
alert(str);
document.getElementById('show').innerHTML=str;
} function showInfo(){ var cartLS = JSON.parse(cartStr); if(cartLS == null){
alert(NULL);
}else{
var str = '';
for(var i=;i<cartLS.length;i++){
str += "ID:"+cartLS[i][] + "\n";
str += "Name:"+cartLS[i][] + "\n";
str += "Logo:"+cartLS[i][] + "\n";
str += "Price:"+cartLS[i][] + "\n";
str += "Num:"+cartLS[i][] + "\n";
}
str = decodeURIComponent(str);
alert(str);
document.getElementById('show').innerHTML=str.replace(/\n/g,"<br />");
} } function clearLS(){
localStorage.clear();
} </script> </head> <body>
<a href="javascript:showStr();">以字符串形式显示</a><br />
<a href="javascript:showInfo();">显示详细</a><br />
<a href="javascript:clearLS();">清空</a><br />
<a href="./">返回设置页面</a><br /> <div style="margin-top:20px;padding:10px" id="show"></div>
</body>
</html>
效果：
以字符串形式显示
显示详细
COOKIE的优化与购物车小试的更多相关文章
- 第一种方式：cookie的优化与购物车实例
一 Cookie 的优化 1.1 一般而言,我们设置cookie是在php中设置 例如: <?php setcookie('testKey1','hello world',0,'/'); //# ...
- php中cookie+mysql实现的购物车代码
<?php//购物车session的产生代码if(! $session && ! $scid) { /* session用来区别每一个购物车,相当于每个车的身份证号: scid只 ...
- 用js+cookie实现商城的购物车功能
页面上的添加功能主要就是两个按钮 <input name="buy" type="image" alt="第一个商品" src=&qu ...
- scrapy框架携带cookie访问淘宝购物车
我们知道,有的网页必须要登录才能访问其内容.scrapy登录的实现一般就三种方式. 1.在第一次请求中直接携带用户名和密码. 2.必须要访问一次目标地址,服务器返回一些参数,例如验证码,一些特定的加密 ...
- 关于SQL优化的一个小试例子
原SQL: select ta.serialno, ta.accepttime, ta.subsnumber, ta.subsname, ta.cont ...
- 【java】Cookie购物车实现
前言 一个基于Cookie的购物车实现 话不多说,直接上代码 导包 import java.net.URLDecoder; import java.util.ArrayList; import jav ...
- [转].net cookie版购物车
本文转自:http://www.sulong.cc/article/program/aspx/110613114249.html #region 添加到购物车AddShoppingCar /// &l ...
- ASP.NET购物车Cookie获取，创建，添加，更新，删除的用法
#region 添加购物车 public void GetShoppingCart(int skuId, int quanlity) { HttpCookie cookie = HttpContext ...
- Cookie实现购物车功能
这里的购物车暂时存放书,后期把参数改成Object,把方法抽取成接口,只要实现了接口的Object类都可以放进购物项,这样就实现了购物任何物品 使用购物项因为一个购物项可以包含某种商品的数量,总价等, ...
随机推荐
- leetcode38
public class Solution { public string CountAndSay(int n) { //1 //11 //21 //1211 //111221 //312211 // ...
- 27.OGNL与ValueStack(VS)-获取Stack Context中的信息
转自:https://wenku.baidu.com/view/84fa86ae360cba1aa911da02.html 我们知道,除了可以从值栈中获取信息,还可以从Stack Context中获取 ...
- XE7 数据库独立运行需要的文件
dbxase.dlldbxmss.dlldbxmss9.dlllibeay32.dllmidas.dllMSVCR100.DLL sqlncli10.dllssleay32.dll
- Windows 2008配置iis+Php+Mysql
windows 2008 与 windows 2003 区别在于前者是iis7,后者是iis6.两个系统下配置Iis+Php+Mysql+Zend Optimizer+GD库+Phpmyadmin基本 ...
- Nginx 前后端分离配置 分发
前端项目VUE 端口8081 , 后端项目JAVA 端口8080 # For more information on configuration, see: # * Official English ...
- Symfony 建立一个Bundle
如果说,这个时候你萌生了一个去看一看Symfony源码的想法,个人建议还是算了,看了之后,你就会感到非常迷茫.因为他实在是大于绝大部分你使用过的框架,并且有多达近二十个的插件,使用了一些非常精巧的设计 ...
- LevelDB Cache
[LevelDB Cache] The contents of the database are stored in a set of files in the filesystem and each ...
- golang之切片与排序
1.排序与查找操作 排序操作在sort包中,sort.Ints对整数进行排序,sort.Strings对字符串进行排序,sort.Float64对浮点数进行排序 package main import ...
- Zookeeper 源码（三）Zookeeper 客户端源码
Zookeeper 源码(三)Zookeeper 客户端源码 Zookeeper 客户端主要有以下几个重要的组件.客户端会话创建可以分为三个阶段:一是初始化阶段.二是会话创建阶段.三是响应处理阶段. ...
- .net手动编写Windows服务
1,打开VS,新建一个windows服务程序.项目名称自定义,我这里用的默认名称:Service1 2,打开Service1,按F7查看代码.代码里有三个方法:public Service1().pr ...