Rasa + Django connect to the view (Front end)

Hello everyone, I’m new in the chatbot world and I’m trying to create one that, among other things, can manage the view of a web created with Django. With the chat widget rasa-webchat I have managed to connect and chat with the bot through socket.io, but I don’t know how I can get that calling a Custom Action updates the view, for example: refreshing the page, redirecting to another view, that is, calling a django endpoint to change the view in the browser… I don’t know if this is possible with Rasa.

In case it’s useful, I’m using Rasa 2.1.2, since higher versions were not compatible with WebChat and/or the connection with Sockets didn’t work.

I don’t know if there would be any way to achieve this by sending some information next to the initPayload, or in the metadata of the messages, or by calling and receiving some kind of Event through the sockets (although being connected through WebChat, I wouldn’t know how to do it).

If someone gives me a hand I will be very grateful.

Let me check first and let you know. I think you have read more about that Please read blog and article of that so you will be more information of that.

Hi @edu_vives welcome to the community.

It would be much easier if you could share some part of the code with us.

I believe it is more of a javascript than a rasa question. if you are using webchat, I believe there is a javascript plugin that receives and sends message to the bot, if so, the JS plugin should be able to read the text and perform actions based on specific texts

1 Like

Apologies for the previous deleted comment, I was having problems with the forum.

The code I have is quite simple, the implementation of the Rasa Webchat:

A Custom Action called ActionLogout.

class ActionLogout(Action):

    def name(self) -> Text:
        return "action_logout"

    def run(self, dispatcher: CollectingDispatcher,
            tracker: Tracker,
            domain: Dict[Text, Any]) -> List[Dict[Text, Any]]:

        requests.get(domainUrl + "logout/", params={"csrfmiddlewaretoken":tracker.get_slot("csrfmiddlewaretoken")},
                     cookies={"sessionid":tracker.get_slot("sessionid"),"csrftoken":tracker.get_slot("csrftoken")})

        if (tracker.get_slot("sessionid")):
            print("Yes, there is a session started")
        else:
            print("No session started")

        if (requests): # successful response
            dispatcher.utter_message(text="The session has been successfully closed")
        else:
            dispatcher.utter_message(text="An error has occurred")

        return []

I have been trying to make a connection with Sockets or with a Rasa Custom Channel, but I have not succeeded, since the Browser session is different and even if I want to send messages they are sent to another new session, so I can not connect to the Front end as I wish.

Anyway, the solution you propose is fully functional. It’s not an elegant way to solve the problem, but it’s the only option I have for now, thank you very much for your answer and excellent help!

In case anyone will find it useful in the future, I have implemented it as follows:

The Rasa Webchat widget has a parameter that allows you to listen to events from the Socket, although it only lets you know when a message has been sent and its text, it doesn’t inform you of the action it corresponds to or anything else… you can also know when it has connected and when it has disconnected from the Socket, but that’s not useful to me in this case.

  1. To add the parameter so that it calls a function when the bot sends a message:
  ...
  
  initPayload: generateInitPayload(),
  customData: { language: "en" },
  socketUrl: "http://localhost:5005",
  onSocketEvent: {
      'bot_uttered': botMessageEvent,
      'connect': function() {
          console.log('connection established')
      },
      'disconnect': function() {
          doSomeCleanup();
      },
  },
  onWidgetEvent: {
      onChatClose: function(widgetEvent) {
          console.log('connection onChatClose')
      },
      onChatOpen: function(widgetEvent) {
          console.log('connection onChatOpen')
      },
      onChatHidden: function(widgetEvent) {
          console.log('connection onChatHidden')
      },
  },
  // add other props here
  },
  ...

In my case the event name is "bot_uttered", since that is the value I have set to the bot message event in the credentials.yml file :

socketio:
  user_message_evt: user_uttered
  bot_message_evt: bot_uttered
  session_persistence: false
  1. To read the event message and react accordingly:
    function botMessageEvent(e) {
        console.log('the bot said something: ' + e.text);

        if (e.text === "The session has been successfully closed") {
            // Do something really cool
        }
    }

If someone finds a more elegant way to know what actions are called, please comment, thanks!