# 网页消息通信

**Repository Path**: xv700/Message-communication-for-web

## Basic Information

- **Project Name**: 网页消息通信
- **Description**: 网页消息通信
Message communication for web
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 0
- **Created**: 2019-06-17
- **Last Updated**: 2022-07-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

    
## 网页消息通信
## Message communication for web

#### 介绍：

> 什么是网页消息通信，即在浏览器中，两个不同页面（A页面的window ！= B页面的window）网页之间的消息传递。
---


#### 目前的传递的方式  

1. WebSocket  （可跨域）  
WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。  [点击进入查看使用方法](https://gitee.com/xv700/websocket) 
   
2. postMessage（可跨域）      
window.postMessage()方法安全地启用Window对象之间的跨源通信。 [点击进入查看使用方法](https://gitee.com/xv700/Message-communication-for-web/tree/master/postMessage)    

3. SharedWorker    
- webworker作为浏览器的一个新特性，可以提供一个额外的线程来执行一些js代码，并且不会影响到浏览器用户界面。
- SharedWorker可以被多个window共同使用，但必须保证这些标签页都是同源的(相同的协议，主机和端口号)。  
[点击进入查看使用方法](https://gitee.com/xv700/Message-communication-for-web/tree/master/SharedWorker/Worker&&SharedWorker)  

4. localStorage  （可以添加事件监听）  
localstorage是浏览器多个标签共用的存储空间，所以可以用来实现多标签之间的通信(ps：session是会话级的存储空间，每个标签页都是单独的）。
直接在window对象上添加监听即可。  
[点击进入查看使用方法](https://gitee.com/xv700/Message-communication-for-web/tree/master/localStorage)  


5.BroadcastChannel IE不支持

6.Server-Sent

具体文档 https://xv700.gitee.io/message-communication-for-web/ 
浏览器内多个标签页之间的通信方式有哪些？
https://github.com/haizlin/fe-interview/issues/25