• 【Web安全】HTML5安全


    目录

    1、HTML5新标签

    1.1 新标签的XSS

    1.2 iframe的sandbox 

    1.3 Link Types:noreferer

    1.4 Canvas的妙用

    2、其他安全问题

    2.1 Cross-Origin Resource Sharing

    2.2 postMessage——跨窗口传递消息

    2.3 Web Storage 


    1、HTML5新标签

    1.1 新标签的XSS

    HTML5定义了很多新标签、新事件,很有可能带来新的XSS攻击。

    如果建立了黑名单,黑名单里如果包含了HTML5新增的标签和功能,就可以避免XSS攻击。

    1.2 iframe的sandbox 

    在HTML5里,专门为iframe定义了一个新的属性,叫sandbox。使用sandbox之后,<iframe>标签加载的内容将被视为一个独立的“源”,其中的脚本将被禁止执行,表单被禁止提交,插件被禁止加载,只想其他浏览对象的链接也被禁止。

    sandbox属性可以通过参数来支持更精确的控制。

    (1)allow-same-origin:允许同源访问

    (2)allow-top-navigation:允许访问顶层窗口

    (3)allow-forms:允许提交表单

    (4)allow-scripts:允许执行脚本

    但是有些行为即使设置了allow-scripts,也不被允许,例如弹出窗口

    1.3 Link Types:noreferer

    在HTML5中为<a>标签和<area>标签定义了一个新的Link Types:noreferer。

    当标签指定了noreferer之后,浏览器在请求该标签指定的地址时将不再发送Referer。

    test

    1.4 Canvas的妙用

    不同于<img>标签只是远程加载一个图片,<canvas>标签让Javascript可以在页面中直接操作图片对象,也可以直接操作像素,构造出图片区域。开发者甚至可以用Canvas在浏览器上写一个小游戏。

    以下浏览器支持<canvas>标签

    (1) IE 7+

    (2) Firefox 3.0+

    (3) Safari 3.0+

    (4) Chrome 3.0+

    (5) Oprea 10.0+

    (6) iPhone 1.0+

    (7) Android 1.0+

    Canvas甚至可以用来破解验证码。通过Javascript操作Canvas的每个像素点,从而自动识别验证码。

    2、其他安全问题

    2.1 Cross-Origin Resource Sharing

    浏览器的同源策略限制了脚本的跨域请求,但跨域访问的需求不断扩大。W3C委员会决定指定一个新的标准来解决跨域访问问题。

    发起的请求必须带上一个Origin Header,用于标记HTTP发起的“源”,服务器端通过识别浏览器自动带上的这个Origin Header,判断请求是否合法。因此,Origin Header可以用于防范CSRF,它不像Referer这么容易被伪造或者清空。

    2.2 postMessage——跨窗口传递消息

    在HTML5中,制定了一个新的API:postMessage。

    postMessage允许每一个window(包括当前窗口、弹出窗口、iframe等)对象往其他的窗口发送文本消息,从而实现跨窗口的消息传递。这个功能不受同源策略的限制

    利用postMessage()给父窗口发消息,可以突破sandbox。

    在使用postMessage()时,需要注意两个问题:
    (1)在必要时,可以在接收窗口验证Domain,甚至验证URL,以防止来自非法页面的消息。实际上就是在代码中实现一次同源策略的验证过程。

    (2)在接收窗口不应信任接收到的信息,需要对消息进行安全检查。

    2.3 Web Storage 

    Web Storage 实现离线浏览功能。

    为什么要有Web Storage 呢?过去浏览器存储信息的方法有以下几种:

    (1)Cookie

    (2)Flash Shared Object

    (3)IE UserData

    其中,Cookie主要用于保存登录凭证和少量信息,其最大长度的限制决定了不可能在Cookie中存储太多信息。而后两者只是Adobe与微软自己的功能,并未成为一个通用标准。因此,客户端出现了一个较为强大和方便的本地存储功能,这就是Web Storage 。

    Web Storage 分为Session Storage和Local Storage。Session Storage关闭浏览器就会失效,而Local Storage会一直存在。Web Storage 就像一个非关系型数据库,由Key-Value对组成,可以通过Javascript对其进行操作。目前Firefox3和IE8都实现了Web Storage 。

    使用方法:

    设置一个值:window.sessionStorage.setItem(key,value);

    读取一个值:window.sessionStorage.getItem(key);

    Web Storage 也受同源策略的约束,每个域所拥有的信息只会保存在自己的域下。

    它的出现让攻击者有了可乘之机,有可能将恶意代码保存在Web Storage中,从而实现跨页面攻击,XSS攻击也可以获取Web Storage中的敏感信息。

  • 相关阅读:
    java项目-第125期SSM的学习成绩管理系统-java毕业设计
    Fedora文件历史记录怎么开启? Fedora历史记录的显示方法
    LeetCode 2609. 最长平衡子字符串
    计算机毕业设计Java花田音乐网站(源码+系统+mysql数据库+lw文档)
    【脚本】生成已划分好训练集、验证集、测试集的数据集对应的train.txt、val.txt、test.txt【包含图像的绝对地址】
    Scala006--Scala中的数据结构【集合】之列表
    MySQL的查询计划(EXPLAIN)
    【React源码】(七)React 调度原理(scheduler)
    C++11 thread 在 Windows 系统中无法使用问题解决
    Invertible Image Signal Processing 可逆图像信号处理
  • 原文地址:https://blog.csdn.net/m0_51683653/article/details/127372040