8

I have an LWC in which I want to use EMP API. Docs say that's only currently available in Aura. Do I have to wrap my entire LWC in aura in order to add the EMP API, or can I create a utility aura component and do pub-sub to/from the LWC?

  • Adding to all the answers. I have created a library for the lightning web component to use streaming api. It does work in LWC, Aura and mobile app as well. github.com/TheVishnuKumar/lwc-streaming-api Note: I am using this in the live project for desktop and mobile app both. – Vishnu Kumar Jul 9 at 2:51
4

Summer 19 is 1 week away, but that won't stop you from preparing it beforehand in your Summer 19 Sandbox or Scratch org.

lightning:empApi does not show LWC button as enabled as its referring to the Spring version of docs.

Also , the release notes dont tell us about how to use empAPI in LWC. I could not find any public documentation on about how to use it.

A quick way to refer docs of lwc is Summer 19 org is to visit the url

https://yourSummer19org.salesforce.com/docs/component-library/bundle/lightning-emp-api/documentation

Sample Example :

<template>
    <lightning-card title="EmpApi Example" icon-name="custom:custom14">
        <div class="slds-m-around_medium">
            <p>Use the buttons below to subscribe and unsubscribe to a streaming channel!</p>
            <lightning-input label="Channel Name" value={channelName}
                onchange={handleChannelName}></lightning-input>
            <lightning-button variant="success" label="Subscribe" title="Subscribe"
                onclick={handleSubscribe} disabled={isSubscribeDisabled}
                class="slds-m-left_x-small"></lightning-button>
            <lightning-button variant="destructive" label="Unsubscribe" title="Unsubscribe"
                onclick={handleUnsubscribe} disabled={isUnsubscribeDisabled}
                class="slds-m-left_x-small"></lightning-button>
        </div>
    </lightning-card>
</template>

JS:

import { LightningElement, track } from 'lwc';
import { subscribe, unsubscribe, onError, setDebugFlag, isEmpEnabled } from 'lightning/empApi';

export default class EmpApiLWC extends LightningElement {
    @track channelName = '/event/Test__e';
    @track isSubscribeDisabled = false;
    @track isUnsubscribeDisabled = !this.isSubscribeDisabled;

    subscription = {};

    // Tracks changes to channelName text field
    handleChannelName(event) {
        this.channelName = event.target.value;
    }

    // Handles subscribe button click
    handleSubscribe() {
        // Callback invoked whenever a new event message is received
        const messageCallback = function(response) {
            console.log('New message received : ', JSON.stringify(response));
            // Response contains the payload of the new message received
        };

        // Invoke subscribe method of empApi. Pass reference to messageCallback
        subscribe(this.channelName, -1, messageCallback).then(response => {
            // Response contains the subscription information on successful subscribe call
            console.log('Successfully subscribed to : ', JSON.stringify(response.channel));
            this.subscription = response;
            this.toggleSubscribeButton(true);
        });
    }

    // Handles unsubscribe button click
    handleUnsubscribe() {
        this.toggleSubscribeButton(false);

        // Invoke unsubscribe method of empApi
        unsubscribe(this.subscription, response => {
            console.log('unsubscribe() response: ', JSON.stringify(response));
            // Response is true for successful unsubscribe
        });
    }

    toggleSubscribeButton(enableSubscribe) {
        this.isSubscribeDisabled = enableSubscribe;
        this.isUnsubscribeDisabled = !enableSubscribe;
    }

    registerErrorListener() {
        // Invoke onError empApi method
        onError(error => {
            console.log('Received error from server: ', JSON.stringify(error));
            // Error contains the server-side error
        });
    }
}
12

How about option 3: Wait a week.

According to the release notes, EmpApi is currently slated to go live in LWC for Summer 19.

  • 1
    Yeah, they specifically referenced it in the release webinar yesterday (June 7th) – BritishBoyinDC Jun 8 at 18:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.