OVERVIEW
In this blog, you will learn,
1. What is Socket.io?
2. How does a socket.io service works?
3. How to deploy Rasa chatbot to any static or dynamic website with socket io
4. How to link the google cloud platform with RasaX and your website together
In our previous blog, you must have learnt how to link the action server to rasa chatbot to perform the custom actions. Now it’s time to upgrade our chatbot and to deploy it on to any website to expand your business and to build a trust for your customers.
What is Socket.io?
Socket.IO is a library that enables bidirectional, real-time and event-based communication between the browser and the server. It consists of:
– Node.js server
– Javascript client library for browser(that can also run from node.js)
In our case we’ll use the built-in feature of rasa chatbot through which we can directly link our chatbot to any website with socket io.
How does a socket.io service works?
Client will try to establish a WebSocket connection if it is possible, and will fallback on HTTP long polling if not.
WebSocket is a communication protocol that provides a full-duplex and low-latency channel between the server and the browser.
So, in the best-case scenario,
- the browser supports WebSocket (97% of all browsers in 2020)
- there is no element (proxy, firewall, …) preventing WebSocket connections between the client and the server
How to deploy Rasa chatbot to any static/dynamic website with socket io
Like we have discussed and created the VM instance on GCP in our previous blogs. Now we’ll continue from our last blog and will inject the script to the website to integrate our chatbot on the website.
In the above image you can see the list of all the VM instances that are created on our GCP account included the one that we created in our previous blogs. To link your chatbot to a website with socket io first remotely access your VM instance as shown below.
Now, move to the project directory and open credentials.yml file with editor available as shown below.
Now update the given credentials for the socket.io inside the credentials.yml file,
socketio: user_message_evt: user_uttered bot_message_evt: bot_uttered session_persistence: true/false
You can also get the detailed description for socket.io here. Now save the opened file and close it. Once this step is done you need to turn down your server and to again turn it up with the given commands.
docker-compose down
docker-compose up -d
Now, you have successfully setup the socket.io credentials for your Rasa X, now you need to inject the socket.io script into the source code of your website. For that you have to copy and paste the given script between the <body> and </body> tag of your website.
<div id="webchat"></div>
<script src="https://cdn.jsdelivr.net/npm/rasa-webchat/lib/index.min.js"></script>
<script>
WebChat.default.init({
selector: "#webchat",
initPayload: "/get_started",
customData: {"language": "en"}, // arbitrary custom data. Stay minimal as this will be added to the socket
socketUrl: "http://localhost:5500",
socketPath: "/socket.io/",
title: "Title",
subtitle: "Subtitle",
params: {"storage": "session"} // can be set to "local" or "session". details in storage section.
})
</script>
After injecting the script into your website your need to update few parameters which are initPayload, socketUrl, title and subtitle as shown below,
For more clarification check out our video,
Once you are done with this save your website and launch it to check whether you have a chatbot integrated on your website or not.
If everything goes right then you will get output like the one you can see here.
Now you can see that your bot is working as per the project that you have on your git repository which we just linked to Rasa x on Google Cloud Platform along with the deployment of action server with rasa x up and running on website with socket io which will allow your chatbot to perform custom actions(like booking a cab, ordering a pizza, check the live status of your train, etc.) from any website with socket io.
For any doubts or queries related to the DEPLOYMENT OF RASA CHATBOT TO WEBSITE WITH SOCKET IO WITH GOOGLE CLOUD PLATFORM feel free to leave a comment below in the comment section. Also, do comment your valuable feedback to appreciate us. For any further information or queries, you can also WhatsApp me at +91 8209829808.
Stay tuned and happy learning. 😉
Hi, a pleasant day, thanks for an amazing tutorial series on Rasa. Kindly, I added the Socket IO to GCP(Google Cloud Platform) but it did not show up on website.
i am trying deploy rasa chat bot in windows 2019 server…i have changed the endpoints.yml action_endpoint: url: “http://x.x.x.x:5055/webhook” core_endpoint: url: http://x.x.x.x:5005/webhook
still running in localhost…how to run it in my server ip
First deploy rasa on the server and use the server IP