正则验证用户名和跨域postmessage

正则验证用户名

跨域postmessage

要用到俩个虚拟机:

html 复制代码
<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>10.1</title>
</head>
 
<body>
    <div>
        <h1>www.s1mple.com</h1>
    </div>
</body>
<script>
    window.addEventListener('message', (event) => {
        if (event.origin === 'http://www.s1mple1.com') {
            const cookieData = event.data;
            //处理cookieData
            console.log('Receive message from parent:', cookieData);
            window.parent.postMessage('child message', '*');
        }
    })
</script>
</html>
html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>iframe</title>
</head>
<body>
    <iframe id="myIframe" src="http://www.s1mple.com/" frameborder="0"></iframe>
</body>
<script>
    window.onload = function() {
        document.cookie = 'sessionid=example'
        const cookieData = document.cookie
        window.frames[0].postMessage(cookieData, 'http://www.s1mple.com/');
    }
    //添加一个监听事件处理子页面的返回消息
    window.addEventListener('message', (event) => {
        if(event.origin === 'http://www.s1mple.com')
        console.log('Received message from child:', event.data);
    })
</script>
</html>

相关推荐
●VON16 分钟前
从零开始:用 Electron 构建你的第一个桌面应用
前端·javascript·electron
lsx20240622 分钟前
Go 语言类型转换
开发语言
t***L2661 小时前
JavaScript在机器学习中的库
开发语言·javascript·机器学习
乔冠宇1 小时前
CSS3中的新增属性总结
前端·javascript·css3
勇闯逆流河2 小时前
【C++】C++11(下)
开发语言·c++
青衫码上行2 小时前
【Java Web学习 | 第15篇】jQuery(万字长文警告)
java·开发语言·前端·学习·jquery
胡萝卜3.08 小时前
掌握C++ map:高效键值对操作指南
开发语言·数据结构·c++·人工智能·map
an86950018 小时前
vue新建项目
前端·javascript·vue.js
电子_咸鱼8 小时前
【STL string 全解析:接口详解、测试实战与模拟实现】
开发语言·c++·vscode·python·算法·leetcode
沐知全栈开发9 小时前
ionic 选项卡栏操作详解
开发语言