iFrame deployment on own server, not CF - dependency resolver does not work with sub-folders

[FritsDonk]

I have been trying to get this to work on our website without much luck. I have now finally downloaded the dist folder into my site and applied all the configurations needed, and I keep running into issues with the dependency injection not understanding the baseUrl loader options corretly.

I am trying to run lex-web-ui from a sub-folder on my site, not the root, e.g. /scripts/lex-web-ui/lex-web-ui-loader.js

any help would be appreciated. For now I am just going to have to publish it on a sub-domain so it can use the root folder/path.

var loaderOptions = { baseUrl: "/scripts/lex-web-ui/", configUrl: "lex-web-ui-loader-config.json", shouldLoadMinDeps: true, };

[atjohns]

Interesting, I admit I have not tried doing this with subfolders so it could very well be an issue with something in the loader. I will try to test this out and see if I can reproduce.

[israelias]

@FritsDonk

Tricky. The entire library is relative to baseUrl. So you have to consider all default loader options beyond just setting configUrl along with the order of precedence passed to the load method of ConfigLoader that depend directly and conditionally on those options to churn out a merged config to load(). Lots of side effects but I’d start with the disclaimer on: configUrl “uses the baseUrl if it is set as a relative URL (not starting with http)” (see Options below)

Options https://github.com/aws-samples/aws-lex-web-ui/blob/master/src/lex-web-ui-loader/js/defaults/loader.js

/**
 * Default loader options
 * Apply both to iframe and full page
 */
export const options = {
  // base URL to be prepended to relative URLs of dependencies
  // if left empty, a relative path will still be used
  baseUrl: '/',

  // time to wait for config event
  configEventTimeoutInMs: 10000,

  // URL to download config JSON file
  // uses baseUrl if set as a relative URL (not starting with http)
  configUrl: './lex-web-ui-loader-config.json',

  // controls whether the local config should be ignored when running
  // embedded (e.g. iframe) in which case the parent page will pass the config
  // Only the parentOrigin config field is kept when set to true
  shouldIgnoreConfigWhenEmbedded: true,

  // controls whether the config should be obtained using events
  shouldLoadConfigFromEvent: false,

  // controls whether the config should be downloaded from `configUrl`
  shouldLoadConfigFromJsonFile: true,

  // Controls if it should load minimized production dependecies
  // set to true for production
  // NODE_ENV is injected at build time by webpack DefinePlugin
  shouldLoadMinDeps: (process.env.NODE_ENV === 'production'),
};

configLoader https://github.com/aws-samples/aws-lex-web-ui/blob/master/src/lex-web-ui-loader/js/lib/config-loader.js

/**
 * Config loader class
 *
 * Loads the chatbot UI config from the following sources in order of precedence:
 * (lower overrides higher):
 *   1. parameter passed to load()
 *   2. Event (loadlexconfig)
 *   3. JSON file
 *   TODO implement passing config in url param
 */

Hope this helps.