Streaming API in Lightning Component getCallback error

Question

I'm making a StreamingAPIListener Lightning component, built on this code from @Eric. (Thanks Eric.)

The component loads up cometd from static resources, then runs doInit, which calls setupPushTopic, which calls my Apex method setupPushTopic to create a PushTopic with a dynamic name that integrates the UserId. The method returns that TopicName, which I store in v.TopicName, and then call Eric's (mostly) startListening method.

COMPONENT:

<aura:component description="No markup, just listening for Streaming API" controller="CometDgetSessionId">

    <aura:attribute name="TopicName" type="String"/>
    <ltng:require scripts="{!$Resource.cometd}" afterScriptsLoaded="{!c.doInit}" />

</aura:component>

CONTROLLER (JS):

({
    doInit: function (component, event, helper) {
        console.log('StreamingAPIListener init. ✅')
        //set up PushTopic
        helper.setupPushTopic(component, event, helper);
        //helper.startListening(component, event, helper);
    },

})

(Yes, I do put little emojis in many of my console.logs -- makes it quick to spot them in the log. They don't mean anything, just visual flags. Try it, you'll like it. 🤪)

startListening calls Apex for the sessionId, then uses that, along with the TopicName to initialize the cometd listener, and then to subscribe to it.

HELPER:

({
    setupPushTopic : function (component, event, helper)
    {
        console.log("setupPushTopic called. 🦊");
        var upsertTopic = component.get("c.setupPushTopic");
        upsertTopic.setCallback(this, function(action)
            {
                var TopicName = action.getReturnValue();
                console.log("😮 TopicName: " + TopicName);
                component.set("v.TopicName", TopicName);
                helper.startListening(component, event, helper);
            });
        $A.enqueueAction(upsertTopic);
    },

    startListening : function (component, event, helper)
    {
        console.log('startListening called. 🎵')
        var TopicName = component.get("v.TopicName");
        //Get a valid Session Id
        var sessionAction = component.get("c.getUserSessionId");
        console.log('🌏 sessionAction: ' + sessionAction);

        sessionAction.setCallback(this, function (a) {
            var state = response.getState();
            if(state === "SUCCESS"){
                var sid = a.getReturnValue();
                var authstring = "OAuth " + sid;
                console.log('🥑SessionId: ' + sid);

                $.cometd.init({
                   url: '/cometd/41.0',
                   requestHeaders: {Authorization: 'OAuth ' + sid},
                   appendMessageTypeToURL: false
                });

                //subscribe
                $.cometd.subscribe('/topic/'+ TopicName, $A.getCallback(function (message) {
                    console.log('in subscribe');
                    var sEvent = $A.get("e.c:SMSreceived");
                    sEvent.setParams({
                        topic: 'New Message',
                        data: message.data.sobject,
                        event: message.data.event
                    }).fire();

                }));

               //closes connection of window close
               window.onbeforeunload = function () {
                   $.cometd.disconnect();
               };
            }
        });

        $A.enqueueAction(sessionAction);
    },


    //more code here
})

It is loading and executing my console.log statements up to...console.log('🌏 sessionAction: ' + sessionAction);. (See, the emoji does help you find it in the code). Then it throws an error that says:

Uncaught Error in $A.getCallback() [response is not defined] Callback failed: apex://CometDgetSessionId/ACTION$getUserSessionId

In the CometD docs, it says:

Subscribe() involves a communication with the Bayeux server and as such cannot be called before calling handshake().

I don't have handshake in there, but I also see in the docs that init() handles both configure and handshake functions, so I guess that's covered...

Any ideas or guidance?

Answer 1

Looks like you have used wrong variable name , happens when you copy paste the code from somewhere else ,

Here is the line that needs to be checked

sessionAction.setCallback(this, function (a) {
        var state = response.getState();//response is not defined ...

Lets change the above lines to this

sessionAction.setCallback(this, function (response) {
        var state = response.getState(); //observe the function passes response now as parameter in the callback :)