React中实现跨窗口通信的常见方法有哪些具体实例可以详细讲解？

本文共计1691个文字，预计阅读时间需要7分钟。

目录：iframe 同源策略内容：当iframe与父窗口同源时：- 效果图当iframe与父窗口不同源时：- 效果图跨窗口通信：一：通过window.parent、frames、top- 效果图二：window.postMessage及其它通信方法- 效果图

目录

• iframe
• 同源策略
• 当iframe与父窗口同源时
• 效果图
• 当iframe与父窗口不同源时
• 效果图
• 跨窗口通信
• 一：通过window.parent、frames、top
• 效果图
• 二：window.postMessage
• 其他通信方法

iframe

跨窗口通信就是在嵌套了iframe的时候，实现iframe与父窗口的通信。

什么是iframe

• 它是一个html标签，它可以将一个网站作为一个dom元素，嵌入到另一个网站中。