You are unable to successfully embed a third-party website or portal into your app using an iframe. This article explains why this occurs and how you can possibly work around it.
Having embedded a website or portal into your app and trying to access it,
- you get on the page either of the following two messages:
- This page is blocked due to insecure content
- This page will not open in an iframe
- or the app redirects to the default device browser instead of showing it in an iframe inside the app. The following error is encountered:
- This site cannot be displayed in embed iframe inside the app
This is usually due to the following reasons:
- Sites that have insecure connections can be blocked from being iframed by the browser. Browsers like Chrome, Safari, Firefox, and others choose how to block these pages, and they even do it differently depending on the platform. (i.e. Safari on your laptop can act differently to Safari on your iPhone.)
- Websites can block from being placed in an iframe using the X-Frame-Options or other detectable means. Websites such as Google.com, Facebook.com, Amazon.com and more block from being iframed. It is possible to check whether a website is not allowing the iframe by using a website such as free iframe checker. Enter the URL and run the checker. Here is a sample of the blocking output from Amazon.com:
- Frame killer scripts: This is another way websites can block from being iframed. Using the frame killer checker on the same website as above, paste the URL and run the checker. If you see the website displayed in the box on their site, you should be ok. If it does not display, they are using alternative means to block the iframe.
- (Applicable to PWA) Our Progressive Web App product is a fully secure web app that is hosted over an SSL secure connection. Sites that have insecure connections can be blocked from being iframed by the browser. Browsers like Chrome, Safari, Firefox, and others choose how to block these pages, and they even do it differently depending on the platform. (i.e. Safari on your laptop can act differently to Safari on your iPhone.)
- This issue is out of BiznessApps Support scope and you have to contact a third party to get your problem resolved. More specifically, you will need to contact the administrator of the web server hosting the page you want to embed and have them disable the security constraints not allowing you to use that page.
- As a workaround, you can also check the "Open in new browser window" option which will open the web page on the user's device native browser (if that doesn't break your app's policies).
Note: If you do wish to check if your problem is related to iframe restriction you can use the tinywebgallery site to check their site for iframes. For more information about security restrictions, you can have a look at this iframe link.
If you get your problem resolved, you will not be getting this error you will be able to browse your app without any problem.