1.0.1 • Published 1 year ago

@unparallel/smartclide-frontend-comm v1.0.1

Weekly downloads
-
License
EPL-2.0
Repository
-
Last release
1 year ago

Overview

This module builds a message according to the protocol established for the communication between the SmartCLIDE IDE frontend and its components, with the following structure:

{
  "type": "...",
  "content": {
    "key1": "value1",
    ...
  }
}

The current version provides:

  • Object with the supported types of messages
Message TypeDirectionDescription
COMM_STARTComponent -> FrontendMessage used to inform the SmartCLIDE IDE frontend that a new component was loaded
COMM_ENDFrontend -> ComponentMessage used to inform the components that no further requests will be accepted
COMM_START_REPLYFrontend -> ComponentReply to the COMM_START message with the information that needs to be sent on startup (token and serviceID fields)
KEYCLOAK_TOKENFrontend -> ComponentUsed to send a token to the iframe, in the token field of the message's content
  • Method to build the message with the given type and content

The upcoming features will include:

  • Support to new types of messages

How to use?

Add as a dependency to the package.json

{
  "dependencies": {
    "@unparallel/smartclide-frontend-comm": "latest"
  }
}

Install dependencies

npm install

Import the module

import {messageTypes, buildMessage} from "@unparallel/smartclide-frontend-comm";

Build the message

// To inform the SmartCLIDE IDE frontend that a new component was loaded
let componentLoadedMessage = buildMessage(messageTypes.COMM_START);

// To inform the components that the communication channel will be closed
let cancelCommunicationMessage = buildMessage(messageTypes.COMM_END);

// To reply to the COMM_START message
let replyToStartMessage = buildMessage(messageTypes.COMM_START_REPLY, { token: "...", serviceID: "..." });

// To send a token to the iframe
let sendTokenMessage = buildMessage(messageTypes.KEYCLOAK_TOKEN, { token: "..." });

Example with window.postMessage()

Sender (Component)

let message = buildMessage(messageTypes.COMM_START);

// Send the message to the parent
window.parent.postMessage(message, "*");

Receiver (Frontend)

// When the parent receives the message
window.addEventListener("message", ({data}) => {
    switch(data.type){
        case messageTypes.COMM_START:
            // Reply with a COMM_START_REPLY type message
            break;
        // ...
    }
});

License

Eclipse Public License 2.0

1.0.1

1 year ago

1.0.0

1 year ago

0.5.0

1 year ago

0.4.0

2 years ago

0.3.0

2 years ago

0.2.0

2 years ago

0.1.0

2 years ago