Get api access in stand alone page

[jinot92]

I am new to aws lex web ui development. Is there a way we can get the API access(such as ping and postMessage) in a FullPageLoader/Standalone page, as I hope to poll my lambda with a particular message.

[bobpskier]

Added a new api in preview off the FullPageComponentLoader class. Offers two methods, ping and postText. Let me know if this meets your requirements. postText sends text to Lex as if the user typed the message.

[jinot92]

Just to clarify, I would be able to use these api's by just loading the bot using the FullPageLoader?

[bobpskier]

Yes. The preview api is provided similar to that in the iframe loader. In this case the class, FullPageComponentLoader, provides the reference to the api. You would then have access to the postText function without having to go to the Vue component.

[jinot92]

Hi,

So in the 'FullPageLoader' class, in the load method, I have tried to get the access in the following manner

load(configParam = {}) {
    return super.load(configParam).then(() => {
      // assign API to this object to make calls more succint
      this.api = this.compLoader.api;
    });
  }

Similarly, I am making use of the 'api' variable, in index.html as

loader.load(chatbotUiConfig).then(function () {
        loader.api.ping();
        loader.api.postText("hi");
        console.log(loader.api);
      })
      .catch(function (error) {
        console.error('chatbot UI failed to load', error);
      });

As of now, I am not able to ping nor postText.

[bobpskier]

I suspect the Vue component is not yet fully mounted and ready to handle events being sent to it in your example. I added a 1/2 second timeout after the loader.load promise returns before sending the ping and postText. With this delay, the ping and postText message worked in my test.

loader.load(chatbotUiConfig).then(function () {
        setTimeout(function() {
          loader.compLoader.api.ping();
          loader.compLoader.api.postText("hi");
          console.log(loader.compLoader.api);
        },500);
      })
      .catch(function (error) {
        console.error('chatbot UI failed to load', error);
      });;

[jinot92]

This worked! Thank @bobpskier