How can I display an Iframe in an iOS app

Question

I have an app created through cordova (just cordova not ionic) for both Android and iOS. The app has an integrated iFrame, which works well in the generated APK. It had a "Cleartext HTTP traffic not permitted" error, which was fixed using some of the instructions posted on this question Android 8: Cleartext HTTP traffic not permitted.

But for iOS 11, the Iframe is not working and it does not display any error message. It loads the frame but is blank inside. The generated app is full of deprecations.

Is there any privacy policy, like the cleartext one but for iOS? or how can I know why the iFrame is not working?

Answer 1

Since you are trying to load plain HTTP content in a web view, it's probably being blocked by App Transport Security. You can add the NSAllowsArbitraryLoadsInWebContent key to the Info.plist for your app, setting the value YES (Boolean type) so that HTTP content can be loaded.

It would be preferable to host that content under HTTPS, if possible. Not only is it more secure, but Apple requires a justification for enabling this exception, and it potentially subjects the app to stricter review (per https://developer.apple.com/documentation/security/preventing_insecure_network_connections#3138036).

Answer 2

I have successfully created many cordova apps in pure html, css, javascript which work with iframe. The iframe content comes from my webserver and populates it. My website is https with ssl so the url i have used is https:// maybe that is what you need. I have tried it with iframe, object and embed and all 3 work fine. below is code sample for object

<object name="search_iframe" data="https://myurl.com/index1.html"
width="100%"
height="90%"
type="text/html">
</object>

In the config.xml file i have added

    <allow-navigation href="https://www.myurl.com*" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />

These are the plugins that i have loaded

<preference name="DisallowOverscroll" value="true" />
    <preference name="android-minSdkVersion" value="22" />
    <preference name="android-targetSdkVersion" value="29" />
    <plugin name="cordova-plugin-device" source="npm" />
    <plugin name="cordova-plugin-device-motion" source="npm"  />
    <plugin name="cordova-plugin-device-orientation" source="npm"  />
    <plugin name="cordova-plugin-splashscreen" source="npm"  />
    <plugin name="cordova-plugin-whitelist" source="npm" />

Everything works fine on my apps . as of 2022 upto Ios 15.2