LWC + Apex from EMP Api callback : Firing dispatch event or an apex call from Streaming api callback fails in LWC, any workaround?

Question

When a dispatch event or an imperative apex call is made from a streaming api callback, then it throws this error in browser console window and reloads the page .

 {"event":{"descriptor":"markup://aura:invalidSession","attributes":{"values":{}},"eventDef":{"descriptor":"markup://aura:invalidSession","t":"APPLICATION","xs":"I","a":{"newToken":["newToken","aura://String","I",false]}}},"exceptionEvent":true}

CallBackCode :

    // Callback invoked whenever a new event message is received
    messageCallback = (response) => {
        try {
            let parsedData = JSON.parse(JSON.parse(JSON.stringify(response)).data.payload);
            if (parsedData.resultMessage.indexOf('Successfully') > -1) {
                // Here if we call an imperative apex or dispatch an event, then it throws the error and reloads the page.
                window.dispatchEvent(
                    new CustomEvent('streamingsuccess', {
                        detail: {
                            payload: parsedData
                        }
                    })
                );
                this.handleUnsubscribe();
            } else {
                this.handleUnsubscribe();
                this.boolSourceOauthDisabled = false;
            }
            this.boolSourceIsLoaded = !this.boolSourceIsLoaded;
        } catch (e) {
            console.error(e);
        }
    };

    handleSubscribe() {
        // Invoke subscribe method of empApi. Pass reference to messageCallback
        subscribe(this.channelName, -1, this.messageCallback).then(response => {
            // Response contains the subscription information on subscribe call
            console.error('Subscription request sent to: ', JSON.stringify(response.channel));
            this.subscription = response;
        });
    }

Has anyone faced this issue and how to fix this?

Even if I use the messageCallback inside handleSubscribe, same issue occurs and the page reloads.

handleSubscribe() {

    // Callback invoked whenever a new event message is received
    const messageCallback =  (response) => {
        try {
            let parsedData = JSON.parse(JSON.parse(JSON.stringify(response)).data.payload);
            if (parsedData.resultMessage.indexOf('Successfully') > -1) {
                // Same error here, if I use a dispatch event , postMessage or an imperative apex call.
// Also as I have to call an apex call here, I tried to call dispatch event or post message from here. And as soon as I access `this` from the `message` event callback, it throws that error again and reloads the page.
                   
            }

        } catch (e) {
            console.error(e);
        }
    }


    // Invoke subscribe method of empApi. Pass reference to messageCallback
    subscribe(this.channelName, -1, messageCallback).then(response => {
        // Response contains the subscription information on subscribe call
        console.error('Subscription request sent to: ', JSON.stringify(response.channel));
        this.subscription = response;
    });
}

Has anyone tried this approach yet?

Answer 1

The issue was related to Api Version of Apex class, once I reduced it to 48 from 49. It worked well.