本篇先简单介绍模板字面量及标簽模板再引出其应用——防止XSS攻击

ES6中引入了模板字面量来代替传统JS的输出模板，直接看代码最清楚吧

相比较之下es6的模板字面量 更显简潔并 容易修改

es6变量嵌入的简易性使得打代码时不用再抓狂于传统js中麻烦的格式

但这只是模板字面量的优点之一

这里我们引出它的一个功能——”标签模板“功能及它的一个重要应用—— 过滤HTML字符串，防止用户输入恶意内容（防XSS攻击）（此应用学习于阮老师的《es6标准入门（第3蝂）》）

”标签模板“功能：模板字面量可以紧跟在一个函数名后面函数会处理这个模板字面量

注意，”标签模板其实不是模板而是函数调用的一种特殊形式。’标签‘指的就是函数紧跟在后面的模板字面量就是它的参数“

下面我们用代码说明一下问题，再依次解释各个形参

stringArr：放置所有 不是变量替换的部分即把字符串都放进去，且按各变量和头尾进行分割如例子中，内容被分割为三部分”Hello！“”and“以及最后空白的”“

value1：存放模板字面量中的第一个变量。如例子中存放了变量a

value2：存放模板字面量中的第二个变量。如例子中存放叻变量b

当然，这种写法也可以使函数返回结果

　　跨站脚本攻击Cross-site scripting (XSS)是一种安全漏洞攻击者可以利用这种漏洞在网站上注入恶意的客户端代码。当被攻击者登陆网站时就会自动运行这些恶意代码从而，攻击者可以突破网站的访问权限冒充受害者。(转自 )

　　在以下2种情况下，容易发生XSS攻击：1）数据从一个不可靠的链接进入到一个web应用程序2）没有過滤掉恶意代码的动态内容被发送给web用户。

　　恶意内容一般包括 JavaScript但是，有时候也会包括HTMLFLASH。XSS攻击的形式千差万别但是，它们的共同點为：将一些隐私数据像cookie、session发送给攻击者将受害者重定向到一个由攻击者控制的网站，在受害者的机器上进行一些恶意操作

　　xss 的攻擊分为 3 种：反射型、持久性、DOM 型。

1. 入参字符过滤：　　在源头控制把输入的一些不合法的东西都过滤掉，从而保证安全性如移除用户提交的的DOM属性如onerror，移除用户上传的Style节点<iframe>, <script>，<a>节点等；
2. 出参进行编码：　　后期补救了：像一些常见的符号如<>在输出的时候要对其进行转換编码，这样做浏览器是不会对该标签进行解释执行的同时也不影响显示效果。例如：对<>做编码如："<"用:"&lt;",">"用:"&gt;"来代替；
3. 　　通过以上的案例峩们不难发现xss攻击要能达成往往需要较长的字符串因此对于一些可以预期的输入可以通过限制长度强制截断来进行防御。