当前位置:首页 > 前端 > 浅谈购物车中cookie的用法

浅谈购物车中cookie的用法

现在比较火的莫过于电商了,天猫双11的火爆,然而我今天要说的是电商背后的事,Cookie。购物车是用户选择商品的一个缓存的地方。其中包含了商品的基本信息,例如:商品的描述,商品的价格,商品的数量等等。对于这个缓存而言,实现的方式是有很多种的,当然也是各有优劣。

电商

  • session:对话的时效性的问题,如果客户选购商品的途中浏览器突然关闭,服务端找不到cookie中的sessionid了,那么选购的商品就不存在了
  • cookie:只要添加了就一直存在,只要不是手动的去清除或者expires为默认的过期时间。但是安全性无法保证,而且也无法对客户的喜好进行定量的分析,有个数和长度的限制。
  • 直接入数据库:添加商品就反复的读写数据库,硬件要求高,影响性能。数据持久存在
  • 缓存数据库:先暂存进入类似redis的缓存数据库中,登录后再写入数据库,但是对硬件有要求

再反观各大电商网站,基本上分为三个流程:

一.例如淘宝,你浏览商品是可以的。但是如果你要添加商品到购物车的话就需要登录;

二.例如京东,无论是未登录还是登录的用户都可以使用将需要的商品添加入购物车内;

三.例如苏宁,添加购物车只显示商品个数,并不显示相关的商品信息,这里就不做讨论了。

如此看来,推测淘宝的业务逻辑是比京东的要简单的。因为登录了话这些数据肯定就要入库了,淘宝财大气粗,技术精湛,数据全部入库对于淘宝来说也不是什么很大的问题。而且这些用户的浏览数据还可以方便淘宝进行大数据的分析,对用户进行商品的推送,乃至于若干年后给你来一个这十年喜爱商品的统计等等。而且只要你加了,除非你自己去删,要不然就等着你花钱来买!你怕不怕.

具体怎么使用或者是结合使用就要看具体的场景和需求了,我们是选择了使用cookie作为购物车商品缓存的介质。

cookie:name=value;

例如下面:cookie的name就是_gads和_utma;value就是ID=b67xxxx015和22xxxx709.5。总数为两个,中间以封号分隔。

1
2
document.cookie;
"_gads=ID=b67e99f3b63cd9db:T=1438053105; _utma=226521935.1840446057.1438107104.1440702591.1446462709.5;

还剩下4个可选参数。expires:设置过期时间。path:设置路径。domain:设置域。secure:设置是否基于https的安全链接。

在添加购物车时我们直接在DOM对象上取得商品的各个属性值。然后将它存入一个product对象里面。再将这个对象转成json格式写入cookie中,cookie的value值只能是字符串,如果不转成json而是直接以对象存入cookie中,在cookie中是以object这个名字存储的,最重要的是cookie中不能携带特殊符号(例如 “$”,”;”).再通过一系列操作将cookie变成最后需要的状态。

后端在用户登录以后到结算页面时候读取cookie,付款页面时将cookie值写入到数据库中,如果携带特殊符号java后端要取得cookie值的话,前端就必须要通过encodeURIComponent()这个方法把值进行编码。要不然后端是无法获取到cookie的值。推荐无论是否有特殊符号都进行编码。

以下是购物车的大致结构:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
"use strict";
  //创建cartlist
  function CartList(cart){
    this.ele=$(cart.ele);
    this.btnBool=cart.obtn;
    this.init();
  }
 
  var setCart={
    ele:"#xxx",
    obtn:false
  };
CartList.prototype={
    init:function(){
         do something...
    },
 
    //创建html
    setCartxxx:function(data_all,data_single){
         do something...
    },
    //添加条目
    renderItem:function(cart_center,data_single){
         do something...
    },
    //商品个数
    setCartxxx:function(num,data_all){
         do something...
    },
    //结算
    showCartxxx:function(data_all){
             do something...
    },
 
    //显示与隐藏
    Cartxxx:function(){
             do something...
    },
  };

电商

代码总结

session和Cookie不能说哪一个好,只是他们在不同的地方使用罢了,登陆注册可以用session,也可以cookie,验证码一般都是Cookie。

  • << 深入理解MVC和MVVM
  • 深入理解Csharp迭代器 >>
  • 作者:
    除非注明,本文原创:知道91,欢迎转载!转载请以链接形式注明本文地址,谢谢。
    原文链接:http://www.zhidao91.com/cart-cookie/

    相关文章 近期热评 最新文章

    • 使用微信JDK实现微信接口签名验证
      要使用微信的接口必须在绑定的域名下测试;签名必须先向微信请求到access_token,然后用access_token再去请求jsapi_ticket,最后用jsapi_ticket和相关的参数按照ASCII码...
    • oracle数据库相关操作注意事项
      修改Oracle SGA(共享内存) 很多网站说修改Oracle的内存通过命令 如果你这么做了,那么恭喜你,你的Oracle数据库无法启动了。如果你已经这么做了,恢复Oracle启动的方...
    • oracle数据库相关操作注意事项
      修改Oracle SGA(共享内存) 很多网站说修改Oracle的内存通过命令 如果你这么做了,那么恭喜你,你的Oracle数据库无法启动了。如果你已经这么做了,恢复Oracle启动的方...
    • 使用微信JDK实现微信接口签名验证
      要使用微信的接口必须在绑定的域名下测试;签名必须先向微信请求到access_token,然后用access_token再去请求jsapi_ticket,最后用jsapi_ticket和相关的参数按照ASCII码...
    • ABP开发指南系列教程(2) – 多层架构...
      为了减少复杂性和提高代码的可重用性,采用分层架构是一种被广泛接受的技术。为了实现分层的体系结构,ABP遵循DDD(领域驱动设计)的原则,将工程分为四个层: 展现层(...
    • ABP开发指南系列教程(1) – 入...
      ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称。 ASP.NET Boilerplate是一个用最佳实践和流行技术开发现代WEB应用程序的新起点,它旨在成为一个通用的WE...
    • Windows下 JIRA + Agile + Mysql 破解...
      本文讲述了Windows下 JIRA + Agile + Mysql 破解安装示例教程
    • c#类的构造函数继承关系示例剖析
      本文通过示例代码讲解了c#子类的构造函数与父类的关系,子类怎样集成父类的构造函数的。