Web存储(上)

Web存储技术(上)

本节主要学习Web存储技术,介绍Web存储技术的背景,学习Cookie的类型、Cookie域、Cookie路径等,还讲解了SessionStorage和LocalStorage两种存储方式。

2021-01-21侠课岛    初级拔高       

前端/前端/前端系列课程P2 15     0     1004

(二十一)Web存储技术(上)

1:背景介绍

  • Cookie - 网站身份证
    • 网站为了辨别用户身份、进行 session 跟踪而储存在用户本地终端上的数据
    • 存储电脑硬盘上的一个txt类型的小文件
    • 安全性问题 - 双刃剑
    • ...
  • Cookie局限
    • 主流浏览器最大支持 4096 字节
    • 主流浏览器限制每个网站的Cookie个数 - 20
    • Cookie默认会跟随所有Http请求发送 - 浪费网络资源
    • 部分浏览器限制Cookie总数 - 300
    • ...
  • Web Storage应运而出
    • 存储大量数据
    • 支持复杂的本地数据库
    • SessionStorage
    • LocalStorage
    • WebSQL

2:Cookie

  • HTML4 - 一般不需要考虑兼容

  • 身份证 - 服务器可以针对不同用户, 做出不同的响应

  • 浏览器储存在用户的机器上的纯文本, 没有可执行代码

  • 浏览器默认携带当前访问网站的Cookie

  • Cookie类型

    • 会话Cookie - 退出浏览器即删除
    • 持久Cookie
    • 特定的过期时间(Expires)
    • 有效期(Max-Age)
  • Cookie域 - Domain

    • 控制Cookie使用权限
  • Cookie路径 - Path

    www.baidu.com                id="123456" domain="www.baidu.com"
    www.baidu.com/user           id="123456" user="eric" domain="www.baidu.com" path="/user/"
    
    www.baidu.com/search         id="123456";
    www.baidu.com/user/search    id="123456" user="eric";
  • Cookie - secure

    • 只有https情况下使用
  • Cookie - HttpOnly

    • 不允许Javascript操作Cookie
  • 安全性

    • 服务器无法分辨用户和攻击者(攻击者窃取网站Cookie)
    • 跨站点脚本XSS
    • 跨站请求伪造CSRF

本教程图文或视频等内容版权归侠课岛所有,任何机构、媒体、网站或个人未经本网协议授权不得转载、转贴或以其他方式复制发布或发表。

评价

15

本课评分:
  •     非常好
难易程度:
  •     适中的

内容目录


本文索引


|
教程
粉丝
主页

签到有礼

已签到2天,连续签到7天即可领取7天全站VIP

  • 1
    +2 金币
  • 2
    +3 金币
  • 3
    +5 金币
  • 6
    +7 金币
  • 5
    +6 金币
  • 4
    暖心福利
    自选分类VIP ×1天
  • 7
    惊喜大礼

    自选分类VIP ×3天 +20金币
  • 持续签到 +8 金币

金币可以用来做什么?