https://github.com/daief/storage-message
基于localStorage封装后用于跨页面消息传递的模块，适用于非跨域情况下，同一页面、跨 tab 页面、移动端不同 webview 页面之间的消息传递
https://github.com/daief/storage-message
npm-package typescript
Last synced: about 1 month ago
JSON representation
基于localStorage封装后用于跨页面消息传递的模块，适用于非跨域情况下，同一页面、跨 tab 页面、移动端不同 webview 页面之间的消息传递
- Host: GitHub
- URL: https://github.com/daief/storage-message
- Owner: daief
- License: mit
- Created: 2018-09-22T08:44:09.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-09-25T08:41:57.000Z (over 7 years ago)
- Last Synced: 2025-06-23T16:48:39.242Z (12 months ago)
- Topics: npm-package, typescript
- Language: JavaScript
- Homepage:
- Size: 107 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# storage-message
基于`window.localStorage`简单封装后进行消息传递的模块，适用于同一页面、跨 tab 页面、移动端不同 webview 页面之间的消息传递，前提是**不可跨域、支持`window.localStorage`**。
## warning
==在 webview 当中使用时存在问题==
- Android 在开启支持 localStorage 的情况下，表现还是可以的
- iOS 中，首先多个 webview 的 localStorage 数据不是同步的，而且并不触发 storage 事件
## install
```bash
npm i storage-message
yarn add storage-message
```
```html
```
## usage
es module:
```js
// page 1
import {storageMessage} from 'storage-message'
const KEY = 'test'
const listener = e => {
const {key, oldValue, newValue} = e
console.log('data', newValue)
}
storageMessage.addEventListener(KEY, listener)
// remove event
// storageMessage.removeEventListener(KEY, listener)
```
```js
// page 2
import {storageMessage} from 'storage-message'
// send message
storageMessage.trigger('test', 'data from page 2')
```
global:
```js
const {storageMessage} = window.StorageMessage
```
## example
```bash
$ git clone git@github.com:daief/storage-message.git
$ cd storage-message && yarn && yarn start
```
open http://localhost:10001/example/page1.html & http://localhost:10001/example/page2.html
