前端安全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.rhkb.cn/news/80369.html

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

相关文章

Vue缓存字典值减少网络请求次数,解决同样参数并发请求多次

前言 在一些项目里&#xff0c;我们可能有着大量的下拉框&#xff0c;而这些下拉框的数据就来源于我们后端接口返回的字典信息。于是&#xff0c;画风可能是这样的&#xff0c;每次下拉&#xff0c;你都需要请求一次字典接口拿到这些数据&#xff0c;于是每次组件刷新都会重复…

Android平台一对一音视频通话方案对比:WebRTC VS RTMP VS RTSP

一对一音视频通话使用场景 一对一音视频通话都需要稳定、清晰和流畅&#xff0c;以确保良好的用户体验&#xff0c;常用的使用场景如下&#xff1a; 社交应用&#xff1a;社交应用是一种常见的使用场景&#xff0c;用户可以通过音视频通话进行面对面的交流&#xff1b;在线教…

分享kubernetes部署:基于Ansible自动安装kubernetes

基于Ansible自动安装kubernetes 环境准备 我们以如下机器环境为例&#xff1a; 开放端口&#xff1a; 控制平面节点 工作节点 请按如上中规定的开放端口&#xff0c;或关闭防火墙&#xff1a; systemctlstopfirewalld&&\ systemctldisablefirewalld 安装常用工具 sudo…

PPT忘记密码如何解除?

PPT文件所带有的两种加密方式&#xff0c;打开密码以及修改权限&#xff0c;两种密码在打开文件的时候都会有相应的提示&#xff0c;但不同的是两种加密忘记密码之后是不同的。 如果忘记了打开密码&#xff0c;我们就没办法打开PPT文件了&#xff1b;如果是忘记了修改密码&…

Android 版本 对应的 API版本

Android 14&#xff08;开发者预览版&#xff09; 如需详细了解平台变更&#xff0c;请参阅 Android 14 文档。 Android 13&#xff08;API 级别 33&#xff09; 如需详细了解平台变更&#xff0c;请参阅 Android 13 文档。 Android 12&#xff08;API 级别 31、32&#xf…

【云原生】Docker-Compose全方面学习

目录 1.compose简介 Compose V2 2.compose安装与下载 二进制包 PIP 安装 bash 补全命令 卸载 3.docker compose管理命令 命令对象与格式 命令选项 命令使用说明 1.compose简介 Compose 是用于定义和运行多容器 Docker 应用程序的工具。通过 Compose&#xff0c;您可…

【音视频】edge与chrome在性能上的比较

目录 结论先说 实验 结论 实验机器的cpu配置 用EDGE拉九路​编辑 google拉五路就拉不出来了 资源使用情况 edge报错​编辑 如果服务器端 性能也满 了&#xff0c;就会不回复&#xff1b;验证方式 手动敲 8081&#xff0c;不回应。 结论先说 实验 用chrome先拉九路&#…

k8s概念-pv和pvc

回到目录 kubernetes存储卷的分类太丰富了,每种类型都要写相应的接口与参数才行&#xff0c;这就让维护与管理难度加大。 persistenvolume(PV) 是配置好的一段存储(可以是任意类型的存储卷) 也就是说将网络存储共享出来,配置定义成PV。 PersistentVolumeClaim(PVC)是用户pod使…

使用隧道HTTP时如何解决网站验证码的问题?

使用代理时&#xff0c;有时候会遇到网站验证码的问题。验证码是为了防止机器人访问或恶意行为而设置的一种验证机制。当使用代理时&#xff0c;由于请求的源IP地址被更改&#xff0c;可能会触发网站的验证码机制。以下是解决网站验证码问题的几种方法&#xff1a; 1. 使用高匿…

APP开发中的性能优化:提升用户满意度的关键

APP开发中的性能优化是需要持续进行的&#xff0c;它不仅能够让用户体验到 APP的使用感受&#xff0c;还能在一定程度上提升用户的满意度&#xff0c;从而提升 APP的粘性和转化率。不过在实际开发中&#xff0c;很多 APP开发公司会存在性能优化上的问题&#xff0c;这就需要了解…

IP提取器对比器

需求&#xff1a; 一个html 页面 &#xff0c;有两个输入框 第一个输入框输入文本中包含多个ip&#xff0c;输入的ip是不规则的&#xff0c;需要使用正则表达式提取出 输入文本的ip地址 &#xff0c; 然后在第二个输入框中输入内容&#xff0c;并提取出内容的ip &#xff0c;如…

Vue基于php医院预约挂号系统_6nrhh

随着信息时代的来临&#xff0c;过去的管理方式缺点逐渐暴露&#xff0c;对过去的医院预约挂号管理方式的缺点进行分析&#xff0c;采取计算机方式构建医院预约挂号系统。本文通过阅读相关文献&#xff0c;研究国内外相关技术&#xff0c;开发并设计一款医院预约挂号系统的构建…

【Linux命令行与Shell脚本编程】第十六章 Shell函数

Linux命令行与Shell脚本编程 第一章 文章目录 Linux命令行与Shell脚本编程六.函数6.1.脚本函数基础6.1.1.创建函数6.1.2.使用函数 6.2.函数返回值6.2.1.默认的退出状态码6.2.2.使用return命令6.2.3.使用函数输出 6.3.函数中使用变量6.3.1.向函数传递参数6.3.2.在函数中处理变量…

OLED透明屏拼缝技术:创新的显示解决方案

引言&#xff1a;OLED透明屏作为一种创新的显示技术&#xff0c;已经在各个领域展现出了巨大的潜力。而其中的拼缝技术更是为OLED透明屏的应用带来了全新的可能性。 对此&#xff0c;尼伽便大家具体介绍一下OLED透明屏拼缝技术的概念、优势以及应用领域&#xff0c;并探讨其在…

JVM之类加载与字节码(二)

3. 编译期处理 什么是语法糖 所谓的 语法糖 &#xff0c;其实就是指 java 编译器把 *.java 源码编译为 *.class 字节码的过程中&#xff0c;自动生成 和转换的一些代码&#xff0c;主要是为了减轻程序员的负担&#xff0c;算是 java 编译器给我们的一个额外福利&#xff08;给…

C高级 作业 day4 8/7

1.整理思维导图 2.写一个函数&#xff0c;获取用户的uid和gid并使用变量接收 3.整理冒泡排序、选择排序和快速排序的代码 冒泡排序 //冒泡排序 void bubble_sort(int a[],int len) {int count0;for(int i1;i<len;i) //控制轮数{for(int j0;j<len-i;j) //控制每一轮交换…

flex 弹性布局

Flex 布局的使用 任何一个容器都可以指定为 Flex 布局。 .box{ display: flex; //flex作为display的一个属性使用 } 行内元素也可以使用 Flex 布局。 .box{ display: inline-flex; } 注意&#xff1a;设为 Flex 布局以后&#xff0c;子元素的float、clear和vertical-align…

Java_理解方法调用

理解方法调用 首先什么是隐式参数 --->隐式参数是调用该方法的对象本身。 接下来方法的名称和参数列表被称为方法的签名&#xff08;signature&#xff09;。在Java中&#xff0c;方法的签名由方法的名称和参数列表组成&#xff0c;用于唯一标识一个方法。返回类型不是签名的…

Mysql存储引擎InnoDB

一、存储引擎的简介 MySQL 5.7 支持的存储引擎有 InnoDB、MyISAM、Memory、Merge、Archive、Federated、CSV、BLACKHOLE 等。 1、InnoDB存储引擎 从MySQL5.5版本之后&#xff0c;默认内置存储引擎是InnoDB&#xff0c;主要特点有&#xff1a; &#xff08;1&#xff09;灾难恢…

【MCU学习】GD32F427VG开发

&#xff08;一&#xff09;学习文档和例程 兆易创新GD32 MCU参考资料下载 1.GD232F4xx的Keil芯片支持包 2.标准固件库和示例程序 3.GD32F4xx_固件库使用指南_Rev1.2 4.用户手册&#xff1a;GD32F4xx_User_Manual_Rev2.8_CN 5.数据手册&#xff1a;GD32F427xx_Datasheet_Rev…