正则验证用户名和跨域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>

相关推荐
willow6 分钟前
Promise由浅入深
javascript·promise
董员外10 分钟前
LangChain.js 快速上手指南:Tool的使用,给大模型安上了双手
前端·javascript·后端
willow42 分钟前
Generator与Iterator
javascript
wuhen_n1 小时前
Pinia状态管理原理:从响应式核心到源码实现
前端·javascript·vue.js
晴殇i2 小时前
CommonJS 与 ES6 模块引入的区别详解
前端·javascript·面试
wuhen_n2 小时前
KeepAlive:组件缓存实现深度解析
前端·javascript·vue.js
wuhen_n2 小时前
Vue Router与响应式系统的集成
前端·javascript·vue.js
FansUnion2 小时前
用 AI 自动生成壁纸标题、描述和 SEO Slug
javascript
大雨还洅下2 小时前
前端 JS: async, await; Generator
javascript
juejin_cn2 小时前
[转][译] 从零开始构建 OpenClaw — 第三部分(元技能)
javascript