每日面试题打卡【1】

82 阅读1分钟

前端跨页面通信的方法,你知道哪些?

回答问题steps:

1.什么是前端跨页面通信?->2.描述具体方法 ->3.总结

跨页面通信就是当我们在打开多个tab页时,想让一些数据在这些tab之间传递、同步是困难的。我所知道的主要有以下七种通信方式。

  • BroadCast Channel

    类似于广播的频道通讯,某一个频道发送消息,其他频道就会收到通知。

  • Service Worker

    它是一个长期运行在后台的Worker,可以实现页面的双向通信。

  • LocalStorage

    是前端最为常见的本地存储,其中有一个StorageEvent的事件,就是当LS发生change的时候就会触发这个事件。

  • Shared Worker

    它没法主动通知所有页面,所有会采用轮询的方式来pull最新的数据。

  • IndexDB

    他与cookie类似,也是采用共享+轮询的方式来实现数据共享。

  • window.open 和window.opener

当然还有非同源页面之间的通信,常见的使用websocket。