前端安全XSS和CSRF讲解

文章目录

    • XSS
      • XSS攻击原理
      • 常见的攻击方式
      • 预防措施
    • CSRF
      • CSRF攻击原理
      • 常见攻击情景
      • 预防措施:
    • CSRF和XSS的区别

XSS

全称Cross Site Scripting,名为跨站脚本攻击。为啥不是单词第一个字母组合CSS,大概率与样式名称css进行区分。

XSS攻击原理

不需要你做任何的登录认证,它会通过合法的操作(比如在url中输入、在评论框中输入),向你的页面注入脚本(可能是js、html代码块等)。

导致的结果可能是:

  • 破坏页面的正常结构
  • 插入广告等恶意内容
  • 盗用Cookie

常见的攻击方式

  • 反射型

    发出请求时,XSS代码出现在url中,作为输入提交到服务器端,服务器端解析后响应,XSS代码随响应内容一起传回给浏览器,最后浏览器解析执行XSS代码。这个过程像一次反射,所以叫反射型XSS。

    示例:
    用户A访问安全网站B,然后用户C发现B网站存在XSS漏洞,此时用户C向A发送了一封邮件,里面有包含恶意脚本的URL地址(此URL地址还是网站B的地址,只是路径上有恶意脚本),当用户点击访问时,因为网站B中cookie含有用户的敏感信息,此时用户C就可以利用脚本在受信任的情况下获取用户A的cookie信息,以及进行一些恶意操作。

  • 存储型

    存储型XSS和反射型XSS的差别在于,提交的代码会存储在服务器端(数据库、内存、文件系统等),下次请求时目标页面时不用再提交XSS代码。

    示例:
    假设网站B是一个博客网站,恶意用户C在存在XSS漏洞的网站B发布了一篇文章,文章中存在一些恶意脚本,例如img标签、script标签等,这篇博客必然会存入数据库中,当其他用户访问该文章时恶意脚本就会执行,然后进行恶意操作。即将携带脚本的数据存入数据库,之后又由后台返回。

预防措施

  1. 对输入、输出结果进行必要的转义和过滤
  2. 尽量使用post,使用get方式时对路径长度进行限制
  3. 使用httponly禁止黑客通过脚本获取用户cookie数据,但这样无法完全阻止xss攻击,因为发送http请求并不需要主动获取cookie

对输入、输出结果进行必要的转义和过滤讲解

  1. 编码:

    对用户输入的数据进行 HTML Entity 编码。

    HTML 实体是一段以连字号(&)开头、以分号(;)结尾的文本(字符串)。实体常常用于显示保留字符(这些字符会被解析为 HTML 代码)和不可见的字符(如“不换行空格”)。你也可以用实体来代替其他难以用标准键盘键入的字符。

    • 不可分的空格: 
    • <(小于符号):&lt;
    • >(大于符号):&gt;
    • &(与符号):&amp;
    • ″(双引号):&quot;
    • '(单引号):&apos;
    • ©(版权符号):&copy;

    以上列出的一些实体比较容易记忆,但有一些不容易记住的您可以查看 whatwg 或使用解码工具。

    在前端,一般为了避免 XSS 攻击,会将 <> 编码为 &lt;&gt;,这些就是 HTML 实体编码。

    在 HTML 转义时,仅仅只需要对六个字符进行编码:&、<、>、"、’ 和 `。我们可以使用 he 库进行编码及转义,html会正常显示经实体编码或转义后的特殊字符。

    // 实体编码
    he.encode('<img src=""></img>') // &#x3C;img src=&#x22;&#x22;&#x3E;&#x3C;/img&#x3E;// 实体转义
    he.escape('<img src=""></img>') // &lt;img src=&quot;&quot;&gt;&lt;/img&gt;
    

    示例:

    document.write('<script>alert(1)</script>')
    

    若不进行任何处理,则浏览器会执行alert的js操作,实现XSS注入。
    进行编码处理之后,在浏览器中的显示结果就是

    <script>alert(1)</script>
    

    实现了作为纯文本进行输出,且不引起JavaScript的执行。

  2. 过滤:

    移除用户输入的和事件相关的属性。如onerror可以自动触发攻击,还有onclick等。(总而言是,过滤掉一些不安全的内容)移除用户输入的Style节点、Script节点、Iframe节点。(尤其是Script节点,它是支持跨域的,一定要移除)。

  3. 校正:

    避免直接对HTML Entity进行解码。使用DOM Parse转换,校正不配对的DOM标签。备注:我们应该去了解一下 DOM Parse 这个概念,它的作用是把文本解析成DOM结构。

    比较常用的做法是,通过第一步的编码转成文本,然后第三步转成DOM对象,然后经过第二步的过滤。

还有一种简洁的方式: 对特定字符做相应的转义,如果是富文本,就白名单。

CSRF

全称 cross-site request forgery,名为跨站请求伪造,顾名思义就是黑客伪装成用户身份来执行一些非用户自愿的恶意以及非法操作。注意,获取cookie是XSS做的事,CSRF的作用是借用cookie,并不能获取cookie。

CSRF攻击原理

在这里插入图片描述

用户是网站A的注册用户,且登录进去,于是网站A就给用户下发cookie。

从上图可以看出,要完成一次CSRF攻击,受害者必须满足两个必要的条件:

  1. 登录受信任网站A,并在本地生成Cookie。(如果用户没有登录网站A,那么网站B在诱导的时候,请求网站A的api接口时,会提示你登录)

  2. 在不登出A的情况下,访问危险网站B(其实是利用了网站A的漏洞)。

我们在讲CSRF时,一定要把上面的两点说清楚。

温馨提示一下,cookie保证了用户可以处于登录状态,但网站B其实拿不到 cookie。

常见攻击情景

用户A经常访问博客网站B,用户C发现网站B存在CSRF漏洞,想尽了各种办法勾引用户A访问了C写好的危险网站D,而此时用户A的cookie信息还没有失效,危险网站D中有向网站B求请求的非法操作,这样用户在不知情的情况下就被操控了。

这个时候就会有一个疑问,浏览器本身有同源策略啊,为什么在网站D还可以请求网站B的api,要记住浏览器对img、iframe和script的src是没有同源限制的!所以黑客完全可以利用动态添加这些标签的方法来实现跨站请求。

预防措施:

  • 判断请求的Referer是否正确:referer 指的是页面请求来源。意思是,只接受本站的请求,服务器才做响应;如果不是,就拦截。

  • 设置cookie的SameSite

    SameSite有3个值:Strict, LaxNone

    • Strict。浏览器会完全禁止第三方cookie。比如a.com的页面中访问 b.com 的资源,那么a.com中的cookie不会被发送到 b.com服务器,只有从b.com的站点去请求b.com的资源,才会带上这些Cookie
    • Lax。相对宽松一些,在跨站点的情况下,从第三方站点链接打开和从第三方站点提交 Get方式的表单这两种方式都会携带Cookie。但如果在第三方站点中使用POST方法或者通过 img、Iframe等标签加载的URL,这些场景都不会携带Cookie。
    • None。任何情况下都会发送 Cookie数据
  • Token 验证

    token不是为了防止XSS的,而是为了防止CSRF的。CSRF攻击的原因是浏览器会自动带上cookie,而不会带上token。

    1. 服务器发送给客户端一个token。
    2. 客户端提交的表单中带着这个token,也可以把 token 隐藏在 http 的 header头中。
    3. 如果这个 token 不合法,那么服务器拒绝这个请求。

    攻击示例

    • cookie:用户点击了链接,cookie未失效,导致发起请求后后端以为是用户正常操作,于是进行扣款操作;
    • token:用户点击链接,由于浏览器不会自动带上token,所以即使发了请求,后端的token验证不会通过,所以不会进行扣款操作;

CSRF和XSS的区别

  1. CSRF需要登陆后操作,XSS不需要
  2. CSRF是请求页面api来实现非法操作,XSS是向当前页面植入js脚本来修改页面内容。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/26468.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

框框大学之——教育技术学

清一色劝退的教育技术学。。。。。。 https://www.kkdaxue.com/?current1&major%E6%95%99%E8%82%B2%E6%8A%80%E6%9C%AF%E5%AD%A6&pageSize10&sortFieldcreateTime&sortOrderdescend 总结&#xff1a; 1 杂而不经 2 摆烂劝退居多 3 适合躺平 4 考公不行 5 要多…

python 将excel 多行进行分组合并

def exc():"""# 需要用到分组的概念:将角色和业务单据的进行分组,结果合并为一行"""df pd.read_excel(test33.xlsx)# 设置需要分组的字段cols [姓名, 科目]#agg() 其中的参数字段为之后输出的表格中的列字段df df.groupby(cols).agg({姓名: f…

在GitHub上管理和协作的完全指南

介绍 GitHub 是一个强大的版本控制和协作平台&#xff0c;它不仅可以帮助你管理和跟踪项目的变化&#xff0c;还可以与他人进行协作。本文将详细介绍如何使用 GitHub 的各种功能来管理和协作项目。 目录 注册GitHub账号创建和管理仓库 创建仓库添加和管理文件分支管理合并请…

Python数据容器——列表(list)

数据容器入门 Python中的数据容器&#xff1a; 一种可以容纳多份数据的数据类型&#xff0c;容纳的每一份数据称之为1个元素 每一个元素&#xff0c;可以是任意类型的数据&#xff0c;如字符串、数字、布尔等。 数据容器根据特点的不同&#xff0c;如&#xff1a;是否支持重复元…

Wordpress升级版本后插件和主题常见出错及处理方法整理【持续更新】

Wordpress报错怎么解决&#xff1f; 一般常用的排查方法&#xff1a; 暂时禁用所有插件&#xff1b;将主题更改为默认主题&#xff1b; 修改wp-config.php文件&#xff1b;更新固定链接设置&#xff0c;确保设置正确&#xff1b;检查.htaccess文件是否存在且是否可写&#xf…

QtAV for ubuntu16.04

下载ubuntu https://releases.ubuntu.com/16.04/ubuntu-16.04.7-desktop-amd64.iso 下载ffmpeg https://ffmpeg.org/download.html 下载QtAV https://github.com/wang-bin/QtAV/releases 更新 sudo apt update 安装库 sudo apt-get install libglu1-mesa-dev freeglut3-dev…

ETHERCAT转PROFIBUS连接到300plc的配置方法

由于捷米JM-DP-ECT&#xff0c;是自主研发的一款PROFIBUS从站功能的通讯网关&#xff0c;它的主要功能是将ETHERCAT设备接入到PROFIBUS网络中生产环境比较复杂有多个设备采用不同的协议这极大的阻碍了&#xff0c;各个设备的数据互通。 JM-DP-ECT这个小小的网关可不简单&#x…

SpringCloud项目打包注意事项以及可能出错的几种情况

SpringCloud项目打包注意事项和可能出错的几种情况 1、检查子模块中的 parent的pom文件路径 \<relativePath/\>2、检查打包插件的位置3、检查module是否重复引用 欢迎访问我的个人博客&#xff1a;https://wk-blog.vip 1、检查子模块中的 parent的pom文件路径 <relat…

Hive常见面试题

Hive的基本概念 什么是Hive&#xff1f;它的主要作用是什么&#xff1f; Hive是一个基于Hadoop生态系统的数据仓库和数据处理工具。 它提供了类似于SQL的查询语言&#xff08;HiveQL&#xff09;&#xff0c;使用户能够使用SQL语句来查询和分析 大规模存储在Hadoop集群上的数…

【计算机视觉|风格迁移】PP-GAN:使用GAN的地标提取器将韩国人像的风格转化为身份证照片

本系列博文为深度学习/计算机视觉论文笔记&#xff0c;转载请注明出处 标题&#xff1a;PP-GAN : Style Transfer from Korean Portraits to ID Photos Using Landmark Extractor with GAN 链接&#xff1a;[2306.13418] PP-GAN : Style Transfer from Korean Portraits to ID…

漫画 | TCP/IP之大明邮差

后记&#xff1a; 1973年&#xff0c;卡恩与瑟夫开发出了网络中最核心的两个协议&#xff1a;TCP协议和IP协议&#xff0c;随后为了验证两个协议的可用性&#xff0c;他们做了一个实验&#xff0c;在多个异构网络中进行数据传输&#xff0c;数据包在经过近10万公里的旅程后到达…

射影平面 与 射影变换

射影平面 与 射影变换 射影平面 与 齐次坐标 中心为O 的把 将与一个点O 关联的所有平面和直线构成的集合称为 中心为O的把O[\lambda, p]射影&#xff08;从平面\pi 到把O的一个对应关系&#xff09;O[P, l] [OP, OL] ...截影&#xff08;从把O 到平面\pi 的一个对应关系&…

laravel安装composer依赖

一.问题描述 拉取的新项目没有依赖 项目根目录没有vendor目录 报错 二.安装composer,拉取依赖 1.如果没有composer先去下载 官网地址:Packagist / Composer 中国全量镜像 我的博客安装composer:composer最新版本安装_荒-漠的博客-CSDN博客 2.进入项目根目录cmd或者在项目中…

【云原生】详细学习Docker-Swarm部署搭建和基本使用

个人主页&#xff1a;征服bug-CSDN博客 kubernetes专栏&#xff1a;云原生_征服bug的博客-CSDN博客 目录 Docker-Swarm编排 1.概述 2.docker swarm优点 3.节点类型 4.服务和任务 5.路由网格 6.实践Docker swarm 1.概述 Docker Swarm 是 Docker 的集群管理工具。它将 Doc…

PHP国外在线教育系统源码 在线课程系统源码 直播课程系统源码提供在线课程,现场课程,测验

Proacademy是在线教育一体化的解决方案&#xff0c;用于创建类似于Udemy、Skillshare、Coursera这种在线教育市场。 这个平台提供在线课程&#xff0c;现场课程&#xff0c;测验等等&#xff0c;并有一个基于实际业务需要的高级认证插件&#xff0c;程序基于Laravel强大的安全框…

全球公链进展| 2023/8/7

一周速览 过去一周&#xff0c;明星项目动态如下&#xff1a; 以太坊核心开发者共识会议决定推迟发布Devnet #8 BNB Chain 发布主网 v1.2.9 版本以及v1.2.10 版本 Arbitrum 已在主网激活对账户抽象端点的支持 Sui 主网升级至 V1.6.3 版本 Aptos 推出 Move v1.4 和 v1.5 …

MySQL 表约束超详细

目录 一. 主键约束——PRIMARY KEY 1.在建表时设置主键约束 设置单字段主键 设置联合主键 2. 在修改表的时候添加主键约束 3. 删除主键约束 4. 【补充】 MySQL设置主键自增长 &#xff1a; 二. 外键约束——FOREIGN KEY 1.在创建表时设置外键约束 2. 在修改表时添加外…

【排序算法略解】(十种排序的稳定性,时间复杂度以及实现思想)(含代码)(完工于2023.8.3)

文章目录 1、冒泡排序/选择排序/插入排序冒泡排序(Bubble Sort)选择排序(Selection Sort)插入排序(Insertion Sort) 2、希尔排序(Shells Sort)3、快速排序(Quick Sort)4、堆排序(Heap Sort)5、归并排序(Merge Sort)6、桶排序/计数排序/基数排序桶排序(Bucket sort)计数排序(Cou…

【sklearn】回归模型常规建模流程

模型训练pipeline 基于数十种统计类型特征&#xff0c;构建LR回归模型。代码逻辑包含&#xff1a;样本切分、特征预处理、模型训练、模型评估、特征重要性的可视化。 步骤一&#xff1a;导入所需库 import pandas as pd import numpy as np import matplotlib.pyplot as plt…

用P2PNet进行大豆计数

文章目录 介绍在大豆数据集上可视化结果环境准备数据集结构数据链接模型训练模型推理代码介绍 这个仓库包含了P2PNet(Rethinking Counting and Localization in Crowds: A Purely Point-Based Framework)在大豆数据集上的pytorch实现。 在大豆数据集上可视化结果 环境准备 …