题源：https://xss.pwnfunction.com/ 点我带你过去

Ma Spaghet!

一、规则

Difficulty is Easy. 【难度是容易】
Pop an alert(1337) on sandbox.pwnfunction.com. 【在sandbox.pwnfunction.com上弹出警报（1337）。】
No user interaction. 【没有用户交互】
Cannot use https://sandbox.pwnfunction.com/?html=&js=&css=. 【无法使用https://sandbox.pwnfunction.com/?html=&js=&css=.】
Tested on Chrome.

二、题目

1、分析

1、从上面可以看出，我们的url中需要有somebody这样一个参数，如果有就get获取它，如果没有，默认值为somebody后面连接一个字符串
2、题目中没有进行条件过滤十分友好，它运用函数innerHTML来插入语句。
3、题目中的一个判断：||
此判断当第一个为真的事后，不再继续判断直接输出。而如果是&& 则是要继续判断。

2、代码输入

本题因为没有条件拦截为此方向大胆随便输入满足规则就可以了。

?somebody=<script>alert(1)</script>

输入结果很奇怪的是它没有弹出1337的警告。

3、错误分析

1、对应本次错误我们首先要想到查看是否插入到html代码中，但是遗憾的是这里插入到代码里了却是我们现在的结果。
2、其次如果不是插入问题，那么便是语法问题。
.
当我们仔细查看原本script直接弹窗代码与我们现在代码区别，发现不同之处只有这是使用了innerHTML函数来插入内容。为此这就是突破点。

4、知识扩展innerHTML

官方文档：https://developer.mozilla.org/zh-CN/docs/Web/API/Element/innerHTML
快快点我带你去瞧瞧

1、定义

Element.innerHTML 属性设置或获取 HTML 语法表示的元素的后代。

如果一个 <div>, <span>, 或 <noembed> 节点有一个文本子节点，该节点包含字符 (&), (<), 或(>),
innerHTML 将这些字符分别返回为&, < 和 > 。
使用Node.textContent 可获取一个这些文本节点内容的正确副本。

2、语法

const content = element.innerHTML;
element.innerHTML = htmlString;

innerHTML函数被赋为htmlstring，并给了content。

本题目则是innerHTML获取了somebody的值给了id：spaghet

3、安全问题【本题script不生效原因】

用 innerHTML 插入文本到网页中并不罕见。但这有可能成为网站攻击的媒介，从而产生潜在的安全风险问题

const name = "John";
// assuming 'el' is an HTML DOM element
el.innerHTML = name; // harmless in this case

// ...

name = "<script>alert('I am John in an annoying alert!')</script>";
el.innerHTML = name; // harmless in this case

尽管这看上去像 cross-site scripting 攻击，结果并不会导致什么。HTML 5 中指定不执行由 innerHTML 插入的

然而，有很多不依赖 <script> 标签去执行 JavaScript 的方式。所以当你使用innerHTML 去设置你无法控制的字符串时，这仍然是一个安全问题。例如：

const name = "<img src='x' onerror='alert(1)'>";
el.innerHTML = name; // shows the alert

如此onerror的内容是无法控制的字符串

基于这个原因，当插入纯文本时，建议不要使用 innerHTML 。 取而代之的是使用 Node.textContent ，它不会把给定的内容解析为 HTML，它仅仅是将原始文本插入给定的位置。

5、最终正确的输入

因为官方文档已经给出了html5是不执行innerHTML插入，为此我们可以用官方给的例子img解题。即便他不安全，但是解题足够了。但是注意的是在现实工作中不建议使用。

?somebody=<img src=1 onerror=alert(1337)>

Jefff

一、规则

Difficulty is Easy. 【难度是容易】
Pop an alert(1337) on sandbox.pwnfunction.com. 【在sandbox.pwnfunction.com上弹出警报（1337）。】
No user interaction. 【没有用户交互】
Cannot use https://sandbox.pwnfunction.com/?html=&js=&css=. 【无法使用https://sandbox.pwnfunction.com/?html=&js=&css=.】
Tested on Chrome.

2、题目

1、分析

1、URL的SearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。
2、我们的url中需要有jeff这样一个参数，如果有就get获取它，如果没有，默认值为jeff后面连接一个字符串
3、运用了eval()函数它会将传入的字符串当做 JavaScript 代码进行执行。
4、利用eval的输出，为此将jeff这闭合双引号，而eval会输入表达式前面两个参数。为此把后一个参数用来弹窗。

2、知识扩展eval()函数

官方文档：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/eval
点击我让你看看eval的真面目

在xss的注入中eval()函数我们通常都可以利用起来。

1、定义

eval() 函数会将传入的字符串当做 JavaScript 代码进行执行

eval收到两个参数的时候收取第一参数为执向值，当为空的时候指向Windows的j全局变量，非空则这个值为eval别名而别名默认指向全局。

2、语法

eval(string)
参数

string
一个表示 JavaScript 表达式、语句或一系列语句的字符串。表达式可以包含变量与已存在对象的属性。

返回值
返回字符串中代码的返回值。如果返回值为空，则返回 undefined。

3、描述 【本题eval输出果原理】

eval() 是全局对象的一个函数属性。

eval() 的参数是一个字符串。如果字符串表示的是表达式，eval() 会对表达式进行求值。如果参数表示一个或多个 JavaScript 语句，那么eval() 就会执行这些语句。不需要用 eval() 来执行一个算术表达式：因为 JavaScript 可以自动为算术表达式求值。

如果你以字符串的形式构造了算术表达式，那么可以在后面用 eval()对它求值。例如，假设你有一个变量 x，您可以通过将表达式的字符串值（例如 3 * x + 2）赋值给一个变量，然后在你的代码后面的其他地方调用 eval()，来推迟涉及 x 的表达式的求值。

==如果 eval() 的参数不是字符串， eval() 会将参数原封不动地返回。==在下面的例子中，String 构造器被指定，而 eval() 返回了 String 对象而不是执行字符串

eval(new String("2 + 2")); // 返回了包含"2 + 2"的字符串对象
eval("2 + 2");             // returns 4

总的来说：
eval会只接受传递的第一个参数，但对传来第二个参数选择性执行。而第二个参数传递进来是字符串或函数

综上：第二参数是字符串进行忽略，不是则执行。第二个传的函数为alert(1)执行【alert(1)存在于在全局变量】

3、代码输入

1、命令行测试

这不行因为这是命令行，但是url可以。

	传值：
	第一个string参数为ma name ${1 字符串
	第二个string参数为alert(1)函数，会执行的

最后效果大概样子（会弹窗）

2.输入内容

?jeff=1";alert(1337)//

对于输入的内容?jeff=1";alert(1337)//，我们实际上输入的是1";alert(1337)//这部分。
这样入就是 eval(ma = "Ma name ${1";alert(1337)//}")
它优先处理占位符${}的内容，然后传参数。
第一个参数：“Ma name ${1”

结果如同

第二个参数：alert(1337)【//后面被注释了不会传输】
在接受了一个参数后，但第二个参数在全局变量里面有的函数于是执行。

Ricardo Milos

一、规则

Difficulty is Easy. 【难度是容易】
Pop an alert(1337) on sandbox.pwnfunction.com. 【在sandbox.pwnfunction.com上弹出警报（1337）。】
No user interaction. 【没有用户交互】
Cannot use https://sandbox.pwnfunction.com/?html=&js=&css=. 【无法使用https://sandbox.pwnfunction.com/?html=&js=&css=.】
Tested on Chrome.

二、题目

1、分析

1、URL的SearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。
2、我们的url中需要有ricardo这样一个参数，如果有就get获取它，如果没有，默认值为ricardo后面连接一个字符串
3、内容输入在ipput标签中，虽然他有输入框可以点击弹窗但是规则要求不能交互。所以不能使用与输入框点击有关的事件。【对于onfocus自动浮点是鼠标自动的，但也产生了交互不行。】
4、已经定为input，为此例如img的onerror就不能用。
5、因为是url需要我们输入，为此它可以识别JavaScript：伪协议。

2、代码输入

?ricardo=javascript:alert(1)

Ah That’s Hawt

一、规则

Difficulty is Easy. 【难度是容易】
Pop an alert(1337) on sandbox.pwnfunction.com. 【在sandbox.pwnfunction.com上弹出警报（1337）。】
No user interaction. 【没有用户交互】
Cannot use https://sandbox.pwnfunction.com/?html=&js=&css=. 【无法使用https://sandbox.pwnfunction.com/?html=&js=&css=.】
Tested on Chrome.

二、题目

1.分析

1、我们的url中需要有markassbrownlee这样一个参数，如果有就get获取它，如果没有，默认值为markassbrownlee后面连接一个字符串
2、运用innerHTML来插入语句
3、过滤了[ ，(，`，)，\，]符号为空
4、过滤的符号为我们常用而且在弹窗会用的，为此我们要考虑不用这些符号的方法。例如，JSFUCK或编码解决。
5、url地址在回车瞬间会将编码瞬间解析转义为URLcode，然后将转义的再给html来识别转码。

2、知识扩展并输入代码

1、JSFUCK

演练网站：http://www.jsfuck.com/ 带你去演练

JSFUCK：可以不使用0-9 a-z 进行编码。

jsfuck源于一门编程语言brainfuck，其主要的思想就是只使用8种特定的符号来编写代码。而jsfuck也是沿用了这个思想，它仅仅使用6种符号来编写代码。它们分别是(、)、+、[、]、!。

实例理解

[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]][([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]]((!![]+[])[+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+!+[]]+(+[![]]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+!+[]]]+(!![]+[])[!+[]+!+[]+!+[]]+(+(!+[]+!+[]+!+[]+[+!+[]]))[(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+([]+[])[([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]][([][[]]+[])[+!+[]]+(![]+[])[+!+[]]+((+[])[([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]]+[])[+!+[]+[+!+[]]]+(!![]+[])[!+[]+!+[]+!+[]]]](!+[]+!+[]+!+[]+[!+[]+!+[]])+(![]+[])[+!+[]]+(![]+[])[!+[]+!+[]])()((![]+[])[+!+[]]+(![]+[])[!+[]+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]+(!![]+[])[+[]]+([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[+!+[]+[!+[]+!+[]+!+[]]]+[+!+[]]+([+[]]+![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[!+[]+!+[]+[+[]]])

内容复制在控制台：弹出1

此题为例，把alert(1)替换

原理解释
上面那段代码的原理其实很简单，它使用了Function关键字定义一个匿名函数，并立即执行了。
如果我们在浏览器敲入下面代码，也会弹出数字“1”：

Function("alert(1)")()

上面函数在js中严格区分大小写所有【F大写】

每个 JavaScript 函数实际上都是一个 Function 对象。
官方文档：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function
Function官方文档点击进入

而我们的示例正是基于这个原理，只不过它使用6个特定字符取到了js中的undefined、true、false、NaN等关键字的字符，并将他们组装成了这个匿名函数。

输入内容在JavaScript的表达

2、多次编码与解码

对于这个问题我们要知道每种编码长什么样子。

一个小技巧
% =》 URL编码
& ; =》 HTML实体编码
&#…； =》Unicode编码

本题为例，因为过滤了[ ，(，`，)，\，]符号所以选择编码解决。因为输入在url地址，所以编码要被URLcode解码。

一个知识点：
在url地址栏输入完后回车一瞬间url就通过URLcode进行解码了，随后把解码内容发送给html。
浏览器解析顺序:URL解析器->HTML 解析器-> CSS 解析器->JS解析器

网址解码后进入html网页解码

这里的问题是就是
当URl编码不存在时候，他先解析html编码，在还未进程序时，已经被解析了，那么我们有什么办法去绕过它呢

第一种绕过payload：<a%20href=“javascript:alert%26%2340%3B1%26%2341”>aaa

第二种绕过payload: <a%20href=“javascript:alert%25281%2529”>aaa

第三种绕过payload（官方payload）：%3Csvg%20onload%3D%22%26%23x61%3B%26%23x6C%3B%26%23x65%3B%26%23x72%3B%26%23x74%3B%26%23x28%3B%26%23x31%3B%26%23x33%3B%26%23x33%3B%26%23x37%3B%26%23x29%3B%22%3E

这整个流程：html实体编码——》URLcode编码——》进入程序——》URLcode解码——》html实体解码

绕过中的%2528解释
html不认识%28【（】与%29【）】
为此url地址：%2528 %25为% %2528在url解析为%28
但是他在html中的href中，href是url的模块。于是可以识别%28 %29

Mafia

一、规则

Difficulty is Easy. 【难度是容易】
Pop an alert(1337) on sandbox.pwnfunction.com. 【在sandbox.pwnfunction.com上弹出警报（1337）。】
No user interaction. 【没有用户交互】
Cannot use https://sandbox.pwnfunction.com/?html=&js=&css=. 【无法使用https://sandbox.pwnfunction.com/?html=&js=&css=.】
Tested on Chrome.

二、题目

1、分析

1、我们的url中需要有mafia这样一个参数，如果有就get获取它，如果没有，默认值为mafia后面连接一个字符串
2、过滤[，`，'，"，+，-，!，\，[，]了这些符号，替换为_
3、过滤alert，替换为_.所有考虑编码与
4、slice：切割函数

2、知识扩展

1、toString()

30进制转使用：parseInt
30进制转回去：toString

parseInt，是Javascript内置函数，原型为parseInt ( String s , [ int radix ] )，用于解析一个字符串，并返回一个整数。
toString()方法可以把一个Number对象转换为一个字符串，并返回结果。

2、hash函数 与slice 函数

hash取的#后所有为值
slice：切割函数，第一个开始切割，即的bbbbb

是eval来使用内部的函数

一定要#来传值

3、Function函数

官方文档：https://developer.mozilla.org/zhCN/docs/Web/JavaScript/Reference/Global_Objects/Function#%E5%8F%82%E8%A7%81
点去看看

每个 JavaScript 函数实际上都是一个 Function 对象。

上面代码中，Function构造函数接受三个参数，除了最后一个参数是add函数的“函数体”，其他参数都是add函数的参数。

3、代码输入

?mafia=eval(8680439..toString(30))(1337)

结合上述知识点，同官方文档

第一个答案
1、js不支持大写，所以官方使用toLowerCase函数让Functiong其小写 【一定得要分隔符[/]不然转小写无效】
2、这种方法实际项目很少使用

Ok, Boomer

一、规则

Difficulty is Easy. 【难度是容易】
Pop an alert(1337) on sandbox.pwnfunction.com. 【在sandbox.pwnfunction.com上弹出警报（1337）。】
No user interaction. 【没有用户交互】
Cannot use https://sandbox.pwnfunction.com/?html=&js=&css=. 【无法使用https://sandbox.pwnfunction.com/?html=&js=&css=.】
Tested on Chrome.

二、题目

1、分析

1、我们的url中需要有boomer这样一个参数，如果有就get获取它，如果没有，默认值为boomer后面连接一个字符串
2、DOMPurify框架比较难绕过，但是我们可以查看版本网上搜找漏洞。
3、setTimeout： setTimeout()方法设置一个定时器，该定时器在定时器到期后执行一个函数或指定的一段代码。
4、setTimeout里的ok，需要属性为ok

2、知识扩展

1、DOMPurify框架

假设我们有一个不受信任的 HTMLhtmlMarkup并且我们想将它分配给某个div，我们使用以下代码使用 DOMPurify 对其进行清理并分配给div：

在解析和序列化 HTML 以及对 DOM 树的操作方面，在上面的简短片段中发生了以下操作：

1. htmlMarkup 被解析为 DOM 树。
2. DOMPurify 清理 DOM 树（简而言之，该过程是遍历 DOM 树中的所有元素和属性，并删除所有不在允许列表中的节点）。
3. DOM 树被序列化回 HTML 标记。
4. 分配给 后innerHTML，浏览器会再次解析 HTML 标记。
5. 解析后的 DOM 树被附加到文档的 DOM 树中。

2、dom与window的量子纠缠

3.代码输入

<a id=ok href=tel:alert(1337)>