Subscribe and Unsubscribe from a Message Channel
To subscribe and unsubscribe from messages on a message channel, import the message channel from the @salesforce/messageChannel scoped module into your Lightning web component. Call the Lightning message service’s subscribe() and unsubscribe() functions.
The lwc-recipes repo has an lmsSubscriberWebComponent component that shows how to subscribe and unsubscribe from a message channel. This example works with the publisher component from Publish on a Message Channel.
Let's take a look at the lmsSubscriberWebComponent component. Selecting a contact from the publisher component publishes the selected record ID to the Record_Selected__c message channel.
The subscriber component's HTML reacts to the published message and displays the data for the contact whose record ID was supplied through the message payload.
In the component’s JavaScript, import the message service features required for subscribing from lightning/messageService. Import the Record_Selected__c message channel from @salesforce/messageChannel.
Use @wire(MessageContext) to create a Context object, which provides information about the Lightning web components that are using the Lightning message service. A component must be attached to the DOM before it can use the property decorated with @wire(MessageContext).
The subscribeToMessageChannel() function checks whether subscription is null. If the subscription is null, it calls the Lightning message service's subscribe() method and assigns it to subscription. The subscribe() method takes three required parameters, the message context, the name of the message channel, and a listener method that handles the published message. When the listener method is invoked, it passes the message to handleMessage(). handleMessage() extracts the recordId property from the JSON message payload that it received. The HTML template is then updated with the information related to the contact that matches the record Id.
To receive messages on a message channel from anywhere in the application, pass { scope: APPLICATION_SCOPE } as the subscribe() method's optional fourth parameter. See Define the Scope of the Message Service.
To stop receiving messages from the Lightning message service, call unsubscribe(), passing in a subscription reference. The subscription object contains a reference to the subscription you want to unsubscribe from. This example calls unsubscribeToMessageChannel(), which calls unsubscribe() and then sets subscription to null.
If you create an API module component that isn’t a LightningElement, you can’t use @wire(MessageContext) to create the MessageContext object. Instead, import createMessageContext() and releaseMessageContext() methods from lightning/messageService. Use createMessageContext() to create the Context object and assign it to a field, like messageContext. Then, pass messageContext into the subscribe() method. The context isn’t automatically released for API module components. Call releaseMessageContext(messageContext) to remove any subscriptions associated with your component’s message context.
See Also