Package Exports

@ceramicnetwork/transport-postmessage

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@ceramicnetwork/transport-postmessage) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

postMessage transport

Transport using postMessage

Installation

npm install @ceramicnetwork/transport-postmessage

Usage

Same origin with a Web Worker

import { PostMessageTransport } from '@ceramicnetwork/transport-postmessage'

const worker = new Worker('worker.js')
const transport = new PostMessageTransport<string>(worker)

transport.subscribe((msg) => {
  console.log(msg)
})
transport.next('test')

Cross-origin between Window and frame

import { PostMessageTransport } from '@ceramicnetwork/transport-postmessage'

const iframe = document.getElementById('iframe')
const transport = new PostMessageTransport<string>(window, iframe, {
  allowedOrigin: 'http://iframe.localhost', // Origin of the iframe messages are received from
  postMessageArguments: ['http://window.localhost'], // Origin of the window sending messages
})

transport.subscribe((msg) => {
  console.log(msg)
})
transport.next('test')

Types and interfaces

PostMessageEventMap

interface PostMessageEventMap {
  message: MessageEvent
  messageerror: MessageEvent
}

PostMessageTarget

interface PostMessageTarget extends EventTarget {
  onmessage: ((this: any, ev: MessageEvent) => any) | null
  onmessageerror: ((this: any, ev: MessageEvent) => any) | null
  postMessage(...args: Array<any>): void
  addEventListener<K extends keyof PostMessageEventMap>(
    type: K,
    listener: (this: any, ev: PostMessageEventMap[K]) => any,
    options?: boolean | AddEventListenerOptions
  ): void
  addEventListener(
    type: string,
    listener: EventListenerOrEventListenerObject,
    options?: boolean | AddEventListenerOptions
  ): void
  removeEventListener<K extends keyof PostMessageEventMap>(
    type: K,
    listener: (this: any, ev: PostMessageEventMap[K]) => any,
    options?: boolean | EventListenerOptions
  ): void
  removeEventListener(
    type: string,
    listener: EventListenerOrEventListenerObject,
    options?: boolean | EventListenerOptions
  ): void
}

PostMessageTransportOptions

type PostMessageTransportOptions = {
  allowedOrigin?: string | Array<string>
  postMessageArguments?: Array<any>
}

API

createOriginFilter()

Type parameters

Event extends MessageEvent

Arguments

allowedOrigin: string | Array<string>

Returns (event: Event) => boolean

createMessageObservable()

Arguments

target: PostMessageTarget
allowedOrigin?: string | Array<string>

Returns Observable<MessageEvent>

createPostMessageObserver()

Type parameters

MessageData

Arguments

target: PostMessageTarget
...args: Array<any>

Returns Observer<MessageData>

PostMessageTransport class

Extends TransportSubject class

Type parameters

MsgIn: the type of the messages coming in from the from target
MsgOut = MsgIn: the type of the messages going out to the to target

new PostMessageTransport()

Arguments

from: PostMessageTarget
to: PostMessageTarget = from
PostMessageTransportOptions = {}

License

Apache-2.0 OR MIT