| 1234567891011121314151617181920212223242526272829303132 |
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="UTF-8" />
- <title>子页面(iframe)</title>
- </head>
- <body>
- <h2>子页面(iframe)</h2>
- <div id="output">等待接收消息...</div>
- <script>
- // 监听来自父页面的消息
- window.addEventListener('message', (event) => {
- // 安全检查:验证来源是否可信
- if (event.origin !== window.parent.location.origin) {
- console.warn('收到未知来源的消息,已忽略:', event.origin);
- return;
- }
- const data = event.data;
- console.log('收到来自父页面的消息:', data);
- // 显示消息内容
- document.getElementById('output').innerHTML = `
- <p>消息: ${data.message}</p>
- <p>用户ID: ${data.userId}</p>
- <p>时间: ${data.timestamp}</p>
- `;
- });
- </script>
- </body>
- </html>
|