Sending Messages to the Lightning Container Component

Use the methods in the lightning-container NPM module to send messages from the JavaScript code framed by lightning:container.

The Lightning-container NPM module provides methods to send and receive messages between your JavaScript app and the Lightning container component. You can see the lightning-container module on the NPM website.

Add the lightning-container module as a dependency in your code to implement the messaging framework in your app.

1import LCC from 'lightning-container';

lightning-container must also be listed as a dependency in your app’s package.json file.

The code to send a message to lightning:container from the app is simple. This code corresponds to the code samples in Sending Messages from the Lightning Container Component and Handling Errors in Your Container.

1sendMessage() {
2  LCC.sendMessage({name: "General", value: this.state.messageToSend});
3}

This code, part of the static resource, sends a message as an object containing a name and a value, which is user-defined.

When the app receives a message, it’s handled by the function mounted by the addMessageHandler() method. In a React app, functions must be mounted to be part of the document-object model and rendered in the output.

The lightning-container module provides similar methods for defining a function to handle errors in the messaging framework. For more information, see lightning:container NPM Module Reference NPM Module Reference

Don't send cryptographic secrets like an API key in a message. It's important to keep your API key secure.

Important

Lightning Aura Components Developer Guide

Sending Messages to the Lightning Container Component