本文目录一览：
XSS攻击的定义，类型以及防御方法？
XXS攻击全称跨站脚本攻击，是一种在Web应用中的计算机安全漏洞，它允许恶意Web用户将代码植入到提供给其他使用的页面中。
XSS攻击有哪几种类型?下面就由锐速云的小编为大家介绍一下
经常见到XSS攻击有三种：反射XSS攻击、DOM-based型XSS攻击以及储存型XSS攻击。
[if !supportLists]1、[endif]反射型XSS攻击
反射性XSS一般是攻击者通过特定手法(如电子邮件)，诱使用户去访问一个包含恶意代码的URL，当受害者点击这些专门设计链接的时候，恶意代码会直接在受害主机上的浏览器上执行，反射型XSS通常出现在网站搜索栏，用户登入口等地方，常用来窃取客户端或进行钓鱼欺骗。
[if !supportLists]2、[endif]存储型XSS攻击
存储型XSS攻击也叫持久型XSS，主要将XSS代码提交储存在服务器端(数据库，内存，文件系统等)下次请求目标页面时不用在提交XSS代码。当目标用户访问该页面获取数据时，XSS代码会从服务器解析之后加载出来，返回到浏览器做正常的HTML和JS解析执行，XSS攻击就发生了。储存型XSS一般出现在网站留言，评论，博客日志等交互处，恶意脚本储存到客户端或者服务端的数据库中。
[if !supportLists]3、[endif]DOM-based型XSS攻击
DOM-based型XSS攻击它是基于DOM的XSS攻击是指通过恶意脚本修改页面的DOM结构，是纯粹发生在客户端的攻击。DOM型XSS攻击中，取出和执行恶意代码由浏览器端完成，属于前端JavaScript自身的安全漏洞。
如何防御XSS攻击?
[if !supportLists]1、[endif]对输入内容的特定字符进行编码，列如表示html标记等符号。
[if !supportLists]2、[endif]对重要的cookie设置httpOnly，防止客户端通过document。cookie读取cookie，此HTTP开头由服务端设置。
[if !supportLists]3、[endif]将不可信的输出URT参数之前，进行URLEncode操作，而对于从URL参数中获取值一定要进行格式检查
[if !supportLists]4、[endif]不要使用Eval来解析并运行不确定的数据或代码，对于JSON解析请使用JSON。Parse()方法
[if !supportLists]5、[endif]后端接口也应该要做到关键字符过滤的问题。
Web前端新手应该如何防御XSS攻击
今天小编要跟大家分享的文章是关于Web前端新手应该如何防御XSS攻击。作为JS系工程师接触最多的漏洞我想就是XSS漏洞了，然而并不是所有的同学对其都有一个清晰的认识。今天我们分享一下XSS漏洞攻击，希望能帮助到大家。下面我们来一起看一看吧！
一、什么是XSS攻击
XSS（Cross-SiteScripting）又称跨站脚本，XSS的重点不在于跨站点，而是在于脚本的执行。XSS是一种经常出现在Web应用程序中的计算机安全漏洞，是由于Web应用程序对用户的输入过滤不足而产生的。
常见的XSS攻击有三种：反射型、DOM-based型、存储型。其中反射型、DOM-based型可以归类为非持久型XSS攻击，存储型归类为持久型XSS攻击。
1、反射型
反射型XSS一般是攻击者通过特定手法（如电子邮件），诱使用户去访问一个包含恶意代码的URL，当受害者点击这些专门设计的链接的时候，恶意代码会直接在受害者主机上的浏览器执行。
对于访问者而言是一次性的，具体表现在我们把我们的恶意脚本通过URL的方式传递给了服务器，而服务器则只是不加处理的把脚本“反射”回访问者的浏览器而使访问者的浏览器执行相应的脚本。反射型XSS的触发有后端的参与，要避免反射性XSS，必须需要后端的协调，后端解析前端的数据时首先做相关的字串检测和转义处理。
此类XSS通常出现在网站的搜索栏、用户登录口等地方，常用来窃取客户端Cookies或进行钓鱼欺骗。
整个攻击过程大约如下：
2、DOM-based型
客户端的脚本程序可以动态地检查和修改页面内容，而不依赖于服务器端的数据。例如客户端如从URL中提取数据并在本地执行，如果用户在客户端输入的数据包含了恶意的JavaScript脚本，而这些脚本没有经过适当的过滤和消毒，那么应用程序就可能受到DOM-basedXSS攻击。需要特别注意以下的用户输入源document.URL、location.hash、location.search、document.referrer等。
整个攻击过程大约如下：
3、存储型
攻击者事先将恶意代码上传或储存到漏洞服务器中，只要受害者浏览包含此恶意代码的页面就会执行恶意代码。这就意味着只要访问了这个页面的访客，都有可能会执行这段恶意脚本，因此储存型XSS的危害会更大。
存储型XSS一般出现在网站留言、评论、博客日志等交互处，恶意脚本存储到客户端或者服务端的数据库中。
整个攻击过程大约如下：
二、XSS攻击的危害
XSS可以导致：
1、攻击劫持访问；
2、盗用cookie实现无密码登录；
3、配合csrf攻击完成恶意请求；
4、使用js或css破坏页面正常的结构与样式等；
三、防御方法
1、XSS防御之HTML编码
应用范围：将不可信数据放入到HTML标签内（例如div、span等）的时候进行HTML编码。
编码规则：将"'/转义为实体字符（或者十进制、十六进制）。
示例代码：
_unction_ncodeForHTML(str,_wargs){
__return(''+_tr)
___.replace(//g,'')
___.replace(/,'')__//_EC=_EX=_ntity=
___.replace(//g,'')
___.replace(/"/g,'"')
___.replace(/'/g,''')_//'_煌萍觯蛭辉_TML规范中
___.replace(/\//g,'/');
_};
HTML有三种编码表现方式：十进制、十六进制、命名实体。例如小于号（
2、XSS防御之HTMLAttribute编码
应用范围：将不可信数据放入HTML属性时（不含src、href、style和事件处理属性），进行HTMLAttribute编码
编码规则：除了字母数字字符以外，使用HH;(或者可用的命名实体)格式来转义ASCII值小于256所有的字符
示例代码：
_unction_ncodeForHTMLAttibute(str,_wargs){
__let_ncoded='';
__for(let_=0;____let_h=_ex=_tr[i];
___if(!/[A-Za-z0-9]/.test(str[i])_tr.charCodeAt(i)____hex=''+_h.charCodeAt(0).toString(16)+';';
___}
___encoded+=_ex;
__}
__return_ncoded;
_};
3、XSS防御之JavaScript编码
作用范围：将不可信数据放入事件处理属性、JavaScirpt值时进行JavaScript编码
编码规则：除字母数字字符外，请使用xHH格式转义ASCII码小于256的所有字符
示例代码：
_unction_ncodeForJavascript(str,_wargs)_
__let_ncoded='';
__for(let_=0;____let_c=_ex=_tr[i];
___if(!/[A-Za-z0-9]/.test(str[i])_tr.charCodeAt(i)____hex='\\x'+_c.charCodeAt().toString(16);
___}
___encoded+=_ex;
__}
__return_ncoded;
_};
4、XSS防御之URL编码
作用范围：将不可信数据作为URL参数值时需要对参数进行URL编码
编码规则：将参数值进行encodeURIComponent编码
示例代码：
_function_ncodeForURL(str,_wargs){
__return_ncodeURIComponent(str);
_};
5、XSS防御之CSS编码
作用范围：将不可信数据作为CSS时进行CSS编码
编码规则：除了字母数字字符以外，使用XXXXXX格式来转义ASCII值小于256的所有字符
示例代码：
_unction_ncodeForCSS(attr,_tr,_wargs){
__let_ncoded='';
__for(let_=0;____let_h=_tr.charAt(i);
___if(!ch.match(/[a-zA-Z0-9]/)_
____let_ex=_tr.charCodeAt(i).toString(16);
____let_ad='000000'.substr((hex.length));
____encoded+='\\'+_ad+_ex;
___}_lse_
____encoded+=_h;
___}
__}
__return_ncoded;
_};
后记
在任何时候用户的输入都是不可信的。对于HTTP参数，理论上都要进行验证，例如某个字段是枚举类型，其就不应该出现枚举以为的值；对于不可信数据的输出要进行相应的编码；此外httpOnly、CSP、X-XSS-Protection、SecureCookie等也可以起到有效的防护。
XSS漏洞有时比较难发现，所幸当下React、Vue等框架都从框架层面引入了XSS防御机制，一定程度上解放了我们的双手。
但是作为开发人员依然要了解XSS基本知识、于细节处避免制造XSS漏洞。框架是辅助，我们仍需以人为本，规范开发习惯，提高Web前端安全意识。
以上就是小编今天为大家分享的关于Web前端新手应该如何防御XSS攻击的文章，希望本篇文章能够对正在从事web前端工作的小伙伴们有所帮助。想要了解更多web前端相关知识记得关注北大青鸟web培训官网。最后祝愿小伙伴们工作顺利！
作者：公子
链接：#/a/1190000017057646
什么是XSS攻击
XSS攻击又称为跨站脚本，XSS的重点不在于跨站点，而是在于脚本的执行。XSS是一种经常出现在Web应用程序中的计算机安全漏洞，是由于Web应用程序对用户的输入过滤不足而产生的，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。
常见的XSS攻击有三种：反射型XSS攻击、DOM-based型XSS攻击、存储型XSS攻击。
第一种：反射型XSS攻击
反射型XSS攻击一般是攻击者通过特定手法，诱使用户去访问一个包含恶意代码的URL，当受害者点击这些专门设计的链接的时候，恶意代码会直接在受害者主机上的浏览器执行。此类XSS攻击通常出现在网站的搜索栏、用户登录口等地方，常用来窃取客户端Cookies或进行钓鱼欺骗。
第二种：DOM-based型XSS攻击
客户端的脚本程序可以动态地检查和修改页面内容，而不依赖于服务器端的数据。例如客户端如从URL中提取数据并在本地执行，如果用户在客户端输入的数据包含了恶意的JavaScript脚本，而这些脚本没有经过适当的过滤或者消毒，那么应用程序就可能受到DOM-based型XSS攻击。需要特别注意以下的用户输入源document.URL、location.hash、location.search、document.referrer 等。
第三种：存储型XSS攻击
攻击者事先将恶意代码上传或者储存到漏洞服务器中，只要受害者浏览包含此恶意代码的页面就会执行恶意代码。这意味着只要访问了这个页面的访客，都有可能会执行这段恶意脚本，因此存储型XSS攻击的危害会更大。此类攻击一般出现在网站留言、评论、博客日志等交互处，恶意脚本存储到客户端或者服务端的数据库中。
XSS攻击的背景知识
1.1 什么是XSS攻击
XSS是一种经常出现在web应用中的计算机安全漏洞，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。比如这些代码包括HTML代码和客户端脚本。攻击者利用XSS漏洞旁路掉访问控制——例如同源策略(same origin policy)。这种类型的漏洞由于被黑客用来编写危害性更大的网络钓鱼(Phishing)攻击而变得广为人知。对于跨站脚本攻击，黑客界共识是：跨站脚本攻击是新型的“缓冲区溢出攻击“，而JavaScript是新型的“ShellCode”。
数据来源：2007 OWASP Top 10的MITRE数据
注：OWASP是世界上最知名的Web安全与数据库安全研究组织
在2007年OWASP所统计的所有安全威胁中，跨站脚本攻击占到了22%，高居所有Web威胁之首。
XSS攻击的危害包括
1、盗取各类用户帐号，如机器登录帐号、用户网银帐号、各类管理员帐号
2、控制企业数据，包括读取、篡改、添加、删除企业敏感数据的能力
3、盗窃企业重要的具有商业价值的资料
4、非法转账
5、强制发送电子邮件
6、网站挂马
7、控制受害者机器向其它网站发起攻击
1.2 XSS漏洞的分类
XSS漏洞按照攻击利用手法的不同，有以下三种类型：
类型A，本地利用漏洞，这种漏洞存在于页面中客户端脚本自身。其攻击过程如下所示：
Alice给Bob发送一个恶意构造了Web的URL。
Bob点击并查看了这个URL。
恶意页面中的JavaScript打开一个具有漏洞的HTML页面并将其安装在Bob电脑上。
具有漏洞的HTML页面包含了在Bob电脑本地域执行的JavaScript。
Alice的恶意脚本可以在Bob的电脑上执行Bob所持有的权限下的命令。
类型B，反射式漏洞，这种漏洞和类型A有些类似，不同的是Web客户端使用Server端脚本生成页面为用户提供数据时，如果未经验证的用户数据被包含在页面中而未经HTML实体编码，客户端代码便能够注入到动态页面中。其攻击过程如下：
Alice经常浏览某个网站，此网站为Bob所拥有。Bob的站点运行Alice使用用户名/密码进行登录，并存储敏感信息(比如银行帐户信息)。
Charly发现Bob的站点包含反射性的XSS漏洞。
Charly编写一个利用漏洞的URL，并将其冒充为来自Bob的邮件发送给Alice。
Alice在登录到Bob的站点后，浏览Charly提供的URL。
嵌入到URL中的恶意脚本在Alice的浏览器中执行，就像它直接来自Bob的服务器一样。此脚本盗窃敏感信息(授权、信用卡、帐号信息等)然后在Alice完全不知情的情况下将这些信息发送到Charly的Web站点。
类型C，存储式漏洞，该类型是应用最为广泛而且有可能影响到Web服务器自身安全的漏洞，骇客将攻击脚本上传到Web服务器上，使得所有访问该页面的用户都面临信息泄漏的可能，其中也包括了Web服务器的管理员。其攻击过程如下：
Bob拥有一个Web站点，该站点允许用户发布信息/浏览已发布的信息。
Charly注意到Bob的站点具有类型C的XSS漏洞。
Charly发布一个热点信息，吸引其它用户纷纷阅读。
Bob或者是任何的其他人如Alice浏览该信息，其会话cookies或者其它信息将被Charly盗走。
类型A直接威胁用户个体，而类型B和类型C所威胁的对象都是企业级Web应用。
什么是xss攻击?
一、什么是跨站脚本攻击
跨站脚本攻击（Cross Site Scripting）缩写为CSS，但这会与层叠样式表（Cascading Style Sheets，CSS）的缩写混淆。通常将跨站脚本攻击缩写为XSS。
跨站脚本攻击（XSS），是最普遍的Web应用安全漏洞。这类漏洞能够使得攻击者嵌入恶意脚本代码到正常用户会访问到的页面中，当正常用户访问该页面时，则可导致嵌入的恶意脚本代码的执行，从而达到恶意攻击用户的目的。
二、跨站脚本攻击的种类
从攻击代码的工作方式可以分为三个类型：
1、持久型跨站：最直接的危害类型，跨站代码存储在服务器（数据库）。
2、非持久型跨站：反射型跨站脚本漏洞，最普遍的类型。用户访问服务器-跨站链接-返回跨站代码。
3、DOM跨站（DOM XSS）：DOM（document object model文档对象模型），客户端脚本处理逻辑导致的安全问题。
三、跨站脚本攻击的手段和目的
常用的XSS攻击手段和目的有：
1、盗用cookie，获取敏感信息。
2、利用植入Flash，通过crossdomain权限设置进一步获取更高权限；或者利用Java等得到类似的操作。
3、利用iframe、frame、XMLHttpRequest或上述Flash等方式，以（被攻击）用户的身份执行一些管理动作，或执行一些一般的如发微博、加好友、发私信等操作。
4、利用可被攻击的域受到其他域信任的特点，以受信任来源的身份请求一些平时不允许的操作，如进行不当的投票活动。
5、在访问量极大的一些页面上的XSS可以攻击一些小型网站，实现DDoS攻击的效果。
四、跨站脚本攻击的防御
XSS攻击主要是由程序漏洞造成的，要完全防止XSS安全漏洞主要依靠程序员较高的编程能力和安全意识，当然安全的软件开发流程及其他一些编程安全原则也可以大大减少XSS安全漏洞的发生。这些防范XSS漏洞原则包括：
1、不信任用户提交的任何内容，对所有用户提交内容进行可靠的输入验证，包括对URL、查询关键字、HTTP头、REFER、POST数据等，仅接受指定长度范围内、采用适当格式、采用所预期的字符的内容提交，对其他的一律过滤。尽量采用POST而非GET提交表单；对“”，“”，“；”，“””等字符做过滤；任何内容输出到页面之前都必须加以en-code，避免不小心把htmltag显示出来。
2、实现Session 标记（session tokens）、CAPTCHA（验证码）系统或者HTTP引用头检查，以防功能被第三方网站所执行，对于用户提交信息的中的img等link，检查是否有重定向回本站、不是真的图片等可疑操作。
3、cookie 防盗。避免直接在cookie中泄露用户隐私，例如email、密码，等等；通过使cookie和系统IP绑定来降低cookie泄露后的危险。这样攻击者得到的cookie没有实际价值，很难拿来直接进行重放攻击。
4、确认接收的内容被妥善地规范化，仅包含最小的、安全的Tag（没有JavaScript），去掉任何对远程内容的引用（尤其是样式表和JavaScript），使用HTTPonly的cookie。