Android WebView Hacking — Enable WebView Debugging

Published in

InfoSec Write-ups

5 min readJul 14, 2022

TL;DR

If you ever come across applications which are using javascript and WebView, these tricks will help you debug the applications easily.

There are two methods to enable WebView debugging:

Smali modification
Using Frida tool

Introduction

There are so many apps out there which are simply wrappers around web pages, or web content stored in the application.

What if:

A developer doesn’t want to create an application in native languages which is in Kotlin (Android) or Swift (iOS).
A developer wants to use certain native platform features with development in html, css and javascript.

There are tons of cool new frameworks available using which developers can build applications which are Cross-platform supported or want to do Hybrid application development.

Cross-Platform application

Cross-platform is a type of software that has the ability to run on multiple computing platforms i.e., Android, iOS, Windows, Blackberry, etc.

The apps built on this framework do not require separate coding for each platform, rather coding once will create the foundation for the app to run as efficiently on all platforms.

It is super cool as you only have to code once and the app can be published to all the platforms. Many of the frameworks built on javascript, which give an advantage to the developers that they don’t have to learn a new language to build the application.

Hybrid application

A hybrid app is essentially a web app, but it’s given a lightweight native app “container” that allows it to leverage certain native platform features and device hardware (e.g., a device’s camera, calendar, push notifications, and pinch and spread functionality) that a web application cannot access.

However, this approach opens up an attack vector into the app, which I will share with you here.

What is WebView?

Android WebView is a system component for the Android operating system (OS) that allows Android apps to display content from the web directly inside an application. A WebView app is composed primarily of Javascript, CSS, and HTML files. Basically, the app is one or more web pages. These web pages make up your front-end interface. If a developer wants to add browser functionality to an application, he/she can include the WebView library and create an instance of a WebView class; this essentially embeds a browser within the app to do things like render web pages and execute JavaScript.

What is WebView Debugging?

In Android WebViews have a debugging feature, that allows you to use the ADB remote debugging extension for chrome to debug the contents of the WebView. Most of the applications which are published on app store this is normally turned off but you can find this feature enabled in demo applications or staging applications if you’re testing. So these small little tricks are to enable that feature on and Android app downloaded from the app store.

There are basically 2 methods to enable WebView debugging

Smali Modification
Using Frida tool

Method 1: Smali Modification

Steps to enable WebView:

Download the application for modification
Remove the application that has WebView disabled. (Original application)
Decompile the application
Turn WebView debugging on (smali modification)
Recompile and Resign the application
Analyze the application

Let’s learn with an example. We will take following application which is written in Cordova framework : SparkChess

Check WebView Status

The first thing we need to check is the application has WebView enabled by default.

We can easily verify by going to chrome://inspect/ in Chrome browser. If you see anything under your connected device means that it is enabled.

Download the application from phone

Identify path of package

adb shell pm path air.com.mediavision.sparkchessphonelite

Pull the apk

adb pull /data/app/air.com.mediavision.sparkchessphonelite-1/base.apk

Decompile the application

Decompile application using apktool

apktool d base.apk

Identify Injection point

One need to figure out where to put the magic lines of code. I generally like to do it on the launcher activity of the app because that will always be run when the app starts.

We can work this out by looking for the activity with the “LAUNCHER” intent filter in the AndroidManifest.xml file. In this case the launcher class was “air.com.mediavision.sparkchessphonelite.MainActivity”

Smali Modifications for WebView

Add the following lines right before the return of the method

const/4 v2, 0x1
invoke-static {v2}, Landroid/webkitWebView;->setWebContentsDebuggingEnabled(Z)V

The first line sets a variable to true and the second line passes that variable to the static method “setWebContentsDebuggingEnabled” in the WebView class.
Additional code to enable debugging is highlighted above.

Recompile and Resigning

Recompile application using apktool

apktool b base/ -o new_app.apk

Resign application using Uber Apk Signer tool

java -jar uber-apk-signer-1.2.1.jar -a ./patched_apk — out ./patched_apk

where patched_apk is the folder which contains the apk and output will be stored to same folder.

Observe new signed application

Install modified application

First you make sure to remove your old application

adb uninstall air.com.mediavision.sparkchessphonelite

Install the modified application

adb install new_app-aligned-debugSigned.apk

Observing the changes

Voila! We now have an app that has WebView debugging enabled. Let’s check it by first opening the application and then opening our beloved Chrome Dev Tools.
Go to: chrome://inspect