Use WebView to open a local html with iframe

Question

I'm using Appcelerator Titanium to develop a mobile app. When I tried to create a WebView to open a local html file with iframe, it opened the html file inside the iframe instead. The parent html was replaced. When I wrapped one more iframe in the second html file, only the innermost html was opened.

The problem only happens in Android. It doesn't happen in iOS. And if the html is on the internet, then it will display correctly. And only local html has this behaviour.

Is it an Android problem or is it Appcelerator's bug? Can it be solved? Thanks in advance.

Here are my sample code:

app.js

var self = Ti.UI.createWindow({});
var url="index.html";
var webview=Ti.UI.createWebView({
url:url,
width:Ti.UI.FILL,
height:Ti.UI.FILL
});
self.add(webview);

index.html

<body style="background:red"> Page 1<br>
<iframe style="width:200px;height:150px;border:solid 3px blue" src="index2.html"></iframe>
</body>

index2.html

<body style="background-color:yellow">
Page 2
</body>

Result in iOS & Android - https://imgur.com/a/XUiFGrI

welcome to SO, please share the minimal, relevant part of your code to other, So they can help you better. — Saeed Zhiany
loading a HTML file locally is indeed a different route than loading an external HTML file. There will be some script injection into local files : github.com/appcelerator/titanium_mobile/blob/… so it might be a problem that inside the iframe is a "new" page. I can reproduce the issue so perhaps you could open a bug at jira.appcelerator.org/secure/Dashboard.jspa — miga

Vikash Bijarniya Vikash Bijarniya · Accepted Answer · 2018-10-22T07:24:38

Create an html file in assets/FolderName. You need to just place your html code in FolderName folder and then use below code to show the html page on webview.

String s = "FolderName/htmlFileName.html";
    StringBuilder aboutText = new StringBuilder();
    try
    {
        InputStream is = getAssets().open(s);
        BufferedReader reader = new BufferedReader(
            new InputStreamReader(is));
        String line;

        while ((line = reader.readLine()) != null)
        {

            aboutText.append(line);
        }
    } catch (IOException e)
    {
        Log.e(LOGTAG, "About html loading failed");
    }

    webView.loadData(aboutText.toString(), "text/html", "UTF-8");

Use WebView to open a local html with iframe

1 Answers