Integrate Conversational AI Webchat in Web Dynpro ABAP (FPM) Application in Combination with Screen Personas

[SaschaW]

Conversational AI is a nice tool for building intelligent chatbots. The Webchat is easy to integrate into your own Application. There are also some nice tutorials to build these into e.g. SAPUI5-applications. But what is with Applications from the old World 🙂 ... for example running Web Dynpro ABAP Applications.

I thought about it for a while and the easiest way that came to my mind was to combine the new world with the old world with Screen Personas. So since Screen Personas 3.0 you can use it with Web Dynpro ABAP.

Some time ago I blogged about our integrated integrated video-based training tool for our customer projects with Floorplan Manager. (link)

So for that tool I createt a small chatbot to support our customers.

I createt a Screen Personas Flavour to integrate that chatbot in the Application.



 

My Script:

/* globals document */

if (!document.getElementById("cai-webchat")) {

  var script = document.createElement("script");

  script.setAttribute("id", "cai-webchat");

  script.setAttribute("src", "https://cdn.recast.ai/webchat/webchat.js");

  document.body.appendChild(script);

}

script.setAttribute("channelId", "<channelId>");

script.setAttribute("token", "<token>");

 

Don't forget to set script onLoad:



 

So as a result you have combined the old world with the new world really easy 🙂