@lihzsky/excelsior-channel NPM

ExcelsiorChannel

基于JSON-RPC 2.0协议的通信工具。用于浏览器多窗口之间的通信。

支持消息延迟通信（在连接建立之前，所有的消息发送都会被缓存，直到连接创建成功）。
支持与本地函数一致的调用方式。
支持控制台打印请求过程。

Browser Requirement

npm.io

Get Start

MAIN WINDOW

import { MainPoint } from '@lihzsky/excelsior-channel';

const frame = document.body.getElementsByTagName('iframe')[0];
const pointer = new MainPoint(frame);

// 定义远程调用的函数
pointer.declare('move', (targetIndex: number, relativeIndex: number) => {
  // move
  console.info('move success!', targetIndex, relativeIndex);
})

// 定义远程调用的函数
pointer.declare('delete', () => {
  // delete
  console.info('delete success!');
})

// 通知update操作
pointer.notify('update')

IFRAME WINDOW/OTHER WINDOW

import { NodePoint } from "@lihzsky/excelsior-channel";

const pointer = new NodePoint();

// 定义远程调用的函数
pointer.declare('update', () => {
  // update
  console.info('update success!');
});

// 通知delete操作，删除指定内容
pointer.notify('delete', 1);

// 调用move操作，移动指定内容
// invoke的方式可以获取到返回的数据，用于下一步的操作
const data = await pointer.invoke('move', 1, 6);

API

Class

MainPoint

主窗口创建端口，用于远程通信。

NodePoint

子窗口创建端口，用于远程通信。

Static Method

wrap(endpoint: CorePoint): any

包裹端口封装。使消息发送与本地调用方式一致。注意：包裹端口后，底层调用方式只支持invoke，不支持notify。

import { MainPoint } from '@2dfire/excelsior-channel';

const frame = document.body.getElementsByTagName('iframe')[0];
const pointer = new MainPoint(frame);
const proxyPointer = MainPoint.wrap(pointer);

// 定义远程调用的函数
proxyPointer.move = (targetIndex: number, relativeIndex: number) => {
  // move
  console.info('move success!', targetIndex, relativeIndex);
}

// 定义远程调用的函数
proxyPointer.delete = () => {
  // delete
  console.info('delete success!');
}

// 通知update操作
proxyPointer.update();