iframe loading timeout

[patran]

The latest release ...All files are from the same origin and in the same directory...

Appreciate all pointers...

Thanks...

(index):82 Error: chatbot loading time out
at readyManager.onConfigEventTimeout (iframe-component-loader.js:356)
(anonymous) @ (index):82
Promise.catch (async)
(anonymous) @ (index):81
(index):117 Uncaught TypeError: Cannot read property 'style' of null
at (index):117
(anonymous) @ (index):117
setTimeout (async)
document.getElementById.onclick @ (index):116

[patran]

I set iframeOrigin to an absolute URL and still getting timeout...

iframe-component-loader.js:212 postMessage not sent over MessageChannel MessageEvent
onMessageFromIframe @ iframe-component-loader.js:212
iframe-component-loader.js:212 postMessage not sent over MessageChannel MessageEvent
onMessageFromIframe @ iframe-component-loader.js:212
(index):82 Error: chatbot loading time out
at readyManager.onConfigEventTimeout (iframe-component-loader.js:356)
(anonymous) @ (index):82

[patran]

I resolved it by simply using the built-in cloud formation

[sidharththapar]

Can you please explain in detail the "built-in cloud formation" method which helped you embed iframe without timing out.

Error faced:
Error: chatbot loading time out
at readyManager.onConfigEventTimeout (iframe-component-loader.js:505)

[abdulsamadCS]

### I am facing the same issue. Unable to resolve!

Can you please explain in detail the "built-in cloud formation" method which helped you embed iframe without timing out.

Error faced:
Error: chatbot loading time out
at readyManager.onConfigEventTimeout (iframe-component-loader.js:524)

[oliverchoy]

Have the same issue on 0.18.0 onwards:
chatbot UI failed to load Error: chatbot loading time out
at e.onConfigEventTimeout (iframe-component-loader.js:517)

[bobpskier]

Timeouts on load occur primarily due to misconfiguration of the parent origin. The LexWebUi is deployed with strict CORS control. If the loader can't access relevant files from the web app s3 bucket via cloud front, it will timeout and produce the error above. In order to pinpoint the problem please let us know the url of the parent page where you are loading the bot, a copy of the lex-web-ui-loader-config.json file, browser console error log messages, and a copy of the network requests made by the browser during page startup. If you see a CORS error in the browser console error log during page load, the parent origin configuration is most likely the culprit.

[UCSBConrad]

I wasn't sure if I should post here or open a new issue. Experiencing the CORS error on v0.19.4.

[bobpskier]

@radycle I would open a new issue and describe the CORS errors in as much detail as you can. These are my steps for debugging CORS issues.

#374 (comment)

[bobpskier]

@manjushankar1972 When I navigate to the page https://cjj.932.myftpupload.com/index.html, it successfully loads the lex-web-ui-loader-config.json file. However, the parentOrigin is to

"parentOrigin": "http://stellaridealabs.com",

This will be problematic when the lexwebui checks for the allowed origins. If the parent page is "https://cjj.932.myftpupload.com/index.html" then the parentOrigin would need to be "https://cjj.932.myftpupload.com".

I also noticed the url above loads from a different cloudfront distribution than listed in point #1. Point #1 indicates https://ddb28chhob2uu.cloudfront.net. The index.html from https://cjj.932.myftpupload.com/ is loading from https://d232ym6dxri0gr.cloudfront.net.

There might be some configuration inconsistencies on the parent page with respect to identifying the lexwebui that should be loaded. I'd start there and make sure the index.html is referencing the correct lexwebui via its reference to the cloudfront distribution.

Once this is correct, then the lex-web-ui-loader-config.json can be confirmed to be set correctly for the parent page. Don't forget that browser cache, and caches maintained by cloudfront need to be cleared after configuration changes as they may be pointing at stale data.